An example would be for a user profile page where the URL includes the user_nicename value instead of a user_id?

Let’s walk through the process of creating a custom page URL like https://xyz.com/user/johndoe, where “johndoe” is the user’s user_nicename value. This can be particularly useful for user profile pages or custom post types.

Step 1: Add a Custom Rewrite Rule

First, we need to add a custom rewrite rule to WordPress. This rule will tell WordPress how to handle our custom URL structure. Add the following code to your theme’s functions.php file:

function add_custom_rewrite_rule() {
    add_rewrite_rule('^user/([^/]*)/?','index.php?pagename=user&user=$matches[1]', 'top');
    add_rewrite_tag('%user%', '([^&]+)');
}
add_action('init', 'add_custom_rewrite_rule', 10, 0);

function add_custom_rewrite_rule() {
    add_rewrite_rule('^user/([^/]*)/?','index.php?pagename=user&user=$matches[1]', 'top');
    add_rewrite_tag('%user%', '([^&]+)');
}
add_action('init', 'add_custom_rewrite_rule', 10, 0);

This rule tells WordPress to match URLs like /user/johndoe and internally rewrite them to index.php?pagename=user-profile&user_slug=johndoe.

Step 2: Add Custom Query Vars

Next, we need to tell WordPress about our custom query variable user_slug. Add this code to your functions.php:

function add_custom_query_vars($query_vars) {
    $query_vars[] = 'user';
    return $query_vars;
}
add_filter('query_vars', 'add_custom_query_vars');

function add_custom_query_vars($query_vars) {
    $query_vars[] = 'user';
    return $query_vars;
}
add_filter('query_vars', 'add_custom_query_vars');

Step 3: Create a Custom Page Template

Now, create a new file in your theme directory called page-user-profile.php. This will be the template for your user profile pages. Here’s a basic example:

<?php
/*
Template Name: User Profile
*/

get_header();

$user_slug = get_query_var('user');
$user = get_user_by('slug', $user_slug);

if ($user) {
    // Display user profile information
    echo '<h1>' . esc_html($user->display_name) . '</h1>';
    echo '<p>Email: ' . esc_html($user->user_email) . '</p>';
    // Add more user information as needed
} else {
    echo '<p>User not found.</p>';
}

get_footer();

<?php
/*
Template Name: User Profile
*/

get_header();

$user_slug = get_query_var('user');
$user = get_user_by('slug', $user_slug);

if ($user) {
    // Display user profile information
    echo '<h1>' . esc_html($user->display_name) . '</h1>';
    echo '<p>Email: ' . esc_html($user->user_email) . '</p>';
    // Add more user information as needed
} else {
    echo '<p>User not found.</p>';
}

get_footer();

Step 4: Create a WordPress Page

In the WordPress admin panel, create a new page and title it “User Profile”. Set the template to the new page you just uploaded, and set the permalink value to “user“. This page won’t be directly accessible, but it’s necessary for our rewrite rule to work.

Step 5: Flush Rewrite Rules

After making these changes, you need to flush the rewrite rules. You can do this by going to Settings > Permalinks in the WordPress admin panel and clicking “Save Changes” without making any changes.

Step 6: Link to User Profiles

Now you can link to user profiles using the custom URL structure. For example:

$user = get_user_by('id', 1);

$profile_url = home_url("/user/{$user->user_nicename}/");

echo '<a href="' . esc_url($profile_url) . '">View Profile</a>';

$user = get_user_by('id', 1);

$profile_url = home_url("/user/{$user->user_nicename}/");

echo '<a href="' . esc_url($profile_url) . '">View Profile</a>';

This should create a link to whichever user has a user ID value of “1”.

Conclusion

Congrats! You’ve successfully created a custom page URL structure for user profiles in WordPress. This technique can be adapted for other custom URL structures as well, such as for custom post types or other specialized pages.

Remember to always sanitize and escape data when working with user input and URLs to ensure the security of your WordPress site.

Good luck!

The Shocking Truth About WordPress Secure Form Security

Let’s kick things off with a jaw-dropping statistic: Did you know that a whopping 43% of cyberattacks target small businesses, with many of these attacks exploiting vulnerabilities in web forms?

As a WordPress developer, you’re not just building websites – you have to create a digital fortress as well. And one of the most crucial battlegrounds in this cybersecurity war is the humble web form. Those innocent-looking input fields can be a hacker’s playground if left unchecked.

By the end of this guide, you’ll be armed with the knowledge and skills to turn your WordPress forms into impenetrable barriers against malicious inputs.

Why Should You Care About Input Validation and Sanitization?

Before we dive into the nitty-gritty, let’s take a moment to understand why we’re even bothering with all this validation and sanitization stuff.

The Dynamic Duo of Form Security

• Input Validation: Think of this as your bouncer at the club door. It checks if the data entering your form meets your criteria. Is that email address actually an email address? Is that phone number made up of digits only? Validation says, “Hey you! Yeah, you with the weird input. You’re not getting in here!” This is primarily handled with JavaScript.
  
• Input Sanitization: This is like your form’s personal hygienist. Once data passes validation, sanitization cleans it up. It removes or encodes potentially harmful characters, ensuring that even if something sneaky slips through validation, it can’t wreak havoc on your system. This is primarily handled with PHP.

The Risks of Skipping Security

Ignoring form security is like leaving your front door wide open in a neighborhood full of mischievous cats. While most visitors might be harmless, eventually one curious feline to knock over your prized vase. In the digital world, these “cats” come in the form of:

• SQL Injection attacks
• Cross-Site Scripting (XSS)
• Remote Code Execution
• Data corruption

Trust me, dealing with any of these is way less fun than cleaning up after a cat party.

Setting Up Your WordPress Form-Handling Fortress

First, we need to set up our WordPress development environment.

The Tools of the Trade

1. WordPress: Make sure you’re running the latest version.
2. A code editor: I’m partial to PHPStorm or VSCode, but use whatever makes your coding heart sing.
3. A local development environment: Tools like Local by Flywheel or XAMPP are great for this.
4. WordPress Debug Mode: Turn this on in your wp-config.php file. It’s like having a super-smart sidekick pointing out your mistakes. Here’s one way.

Creating Your Custom Form-Handling Plugin

Why a plugin? Because it keeps your functionality separate from your theme, making it portable and easier to maintain. Plus, it makes you feel like a real WordPress wizard.

Here’s a basic structure to get you started:

<?php
/**
 * Plugin Name: SuperSecure Form Handler
 * Description: Handles form inputs like a boss!
 * Version: 1.0
 * Author: Your Awesome Name
 */

if (!defined('ABSPATH')) exit; // Exit if accessed directly

class SuperSecureFormHandler {
    public function __construct() {
        add_action('init', array($this, 'init'));
    }

    public function init() {
        // We'll add our form handling magic here
    }
}

new SuperSecureFormHandler();

<?php
/**
 * Plugin Name: SuperSecure Form Handler
 * Description: Handles form inputs like a boss!
 * Version: 1.0
 * Author: Your Awesome Name
 */

if (!defined('ABSPATH')) exit; // Exit if accessed directly

class SuperSecureFormHandler {
    public function __construct() {
        add_action('init', array($this, 'init'));
    }

    public function init() {
        // We'll add our form handling magic here
    }
}

new SuperSecureFormHandler();

Basic PHP Validation Techniques: Your First Line of Defense

Now that we’ve got our plugin set up, let’s start with some basic validation techniques. Think of these as the foundation of your fortress – not flashy, but absolutely essential.

The Power of PHP’s Built-in Functions

PHP comes with a treasure trove of basic validation functions. Here are some of my favorites:

// Is it an email?
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
    $errors[] = "Invalid email format";
}

// Is it a number?
if (!is_numeric($age)) {
    $errors[] = "Age must be a number";
}

// Is it within a range?
if ($age < 18 || $age > 99) {
    $errors[] = "Age must be between 18 and 99";
}

// Is it not empty?
if (empty($name)) {
    $errors[] = "Name is required";
}

// Is it an email?
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
    $errors[] = "Invalid email format";
}

// Is it a number?
if (!is_numeric($age)) {
    $errors[] = "Age must be a number";
}

// Is it within a range?
if ($age < 18 || $age > 99) {
    $errors[] = "Age must be between 18 and 99";
}

// Is it not empty?
if (empty($name)) {
    $errors[] = "Name is required";
}

Crafting Custom Validation Rules

Sometimes, the built-in functions just won’t cut it. That’s when you need to roll up your sleeves and create custom validation rules. Here’s an example of validating a username:

function validate_username($username) {
    // Only allow alphanumeric characters and underscores
    if (!preg_match('/^[a-zA-Z0-9_]+$/', $username)) {
        return false;
    }
    
    // Username should be between 4 and 20 characters
    if (strlen($username) < 4 || strlen($username) > 20) {
        return false;
    }
    
    return true;
}

function validate_username($username) {
    // Only allow alphanumeric characters and underscores
    if (!preg_match('/^[a-zA-Z0-9_]+$/', $username)) {
        return false;
    }
    
    // Username should be between 4 and 20 characters
    if (strlen($username) < 4 || strlen($username) > 20) {
        return false;
    }
    
    return true;
}

Advanced Validation Strategies: Leveling Up Your Form Game

Let’s explore some advanced techniques that’ll make your forms smoother than a fresh jar of Skippy.

Real-time Validation with AJAX

Nobody likes waiting until they hit the submit button to find out they’ve messed up. With AJAX, you can provide real-time feedback as users fill out your form. Here’s a quick example using jQuery, which comes included with WordPress:

$('#username').on('blur', function() {
    var username = $(this).val();
    $.ajax({
        url: ajaxurl, // This is defined by WordPress
        type: 'POST',
        data: {
            action: 'validate_username',
            username: username
        },
        success: function(response) {
            if (response.valid) {
                $('#username-error').hide();
            } else {
                $('#username-error').show().text(response.message);
            }
        }
    });
});

$('#username').on('blur', function() {
    var username = $(this).val();
    $.ajax({
        url: ajaxurl, // This is defined by WordPress
        type: 'POST',
        data: {
            action: 'validate_username',
            username: username
        },
        success: function(response) {
            if (response.valid) {
                $('#username-error').hide();
            } else {
                $('#username-error').show().text(response.message);
            }
        }
    });
});

And in your PHP file functions.php:

add_action('wp_ajax_validate_username', 'ajax_validate_username');
add_action('wp_ajax_nopriv_validate_username', 'ajax_validate_username');

function ajax_validate_username() {
    $username = $_POST['username'];
    $is_valid = validate_username($username);
    
    wp_send_json(array(
        'valid' => $is_valid,
        'message' => $is_valid ? '' : 'Invalid username'
    ));
}

add_action('wp_ajax_validate_username', 'ajax_validate_username');
add_action('wp_ajax_nopriv_validate_username', 'ajax_validate_username');

function ajax_validate_username() {
    $username = $_POST['username'];
    $is_valid = validate_username($username);
    
    wp_send_json(array(
        'valid' => $is_valid,
        'message' => $is_valid ? '' : 'Invalid username'
    ));
}

Handling File Uploads Like a Pro

File uploads can be a security nightmare if not handled correctly. Here’s how to validate file uploads without breaking a sweat (this code would be in your functions.php file):

function validate_file_upload($file) {
    $allowed_types = array('jpg', 'jpeg', 'png', 'gif');
    $max_size = 5 * 1024 * 1024; // 5MB
    
    $file_name = $file['name'];
    $file_size = $file['size'];
    $file_tmp = $file['tmp_name'];
    
    // Check file extension
    $ext = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));
    if (!in_array($ext, $allowed_types)) {
        return "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    }
    
    // Check file size
    if ($file_size > $max_size) {
        return "Sorry, your file is too large. Max size is 5MB.";
    }
    
    // Check MIME type
    $finfo = finfo_open(FILEINFO_MIME_TYPE);
    $mime = finfo_file($finfo, $file_tmp);
    finfo_close($finfo);
    
    if (!in_array($mime, array('image/jpeg', 'image/png', 'image/gif'))) {
        return "File type not allowed.";
    }
    
    return true; // File is valid
}

function validate_file_upload($file) {
    $allowed_types = array('jpg', 'jpeg', 'png', 'gif');
    $max_size = 5 * 1024 * 1024; // 5MB
    
    $file_name = $file['name'];
    $file_size = $file['size'];
    $file_tmp = $file['tmp_name'];
    
    // Check file extension
    $ext = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));
    if (!in_array($ext, $allowed_types)) {
        return "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    }
    
    // Check file size
    if ($file_size > $max_size) {
        return "Sorry, your file is too large. Max size is 5MB.";
    }
    
    // Check MIME type
    $finfo = finfo_open(FILEINFO_MIME_TYPE);
    $mime = finfo_file($finfo, $file_tmp);
    finfo_close($finfo);
    
    if (!in_array($mime, array('image/jpeg', 'image/png', 'image/gif'))) {
        return "File type not allowed.";
    }
    
    return true; // File is valid
}

Sanitization: Cleaning Up the Riffraff

Validation is great, but sometimes sneaky data can still slip through. That’s where sanitization comes in, ensuring that even if bad data gets past validation, it can’t cause any mischief.

WordPress Sanitization Functions: Your New Best Friends

WordPress comes with a bunch of handy sanitization functions. Here are some you’ll want to keep in your back pocket:

// For plain text
$clean_text = sanitize_text_field($_POST['user_input']);

// For HTML content (like from a WYSIWYG editor)
$clean_html = wp_kses_post($_POST['html_input']);

// For emails
$clean_email = sanitize_email($_POST['email_input']);

// For URLs
$clean_url = esc_url_raw($_POST['url_input']);

// For plain text
$clean_text = sanitize_text_field($_POST['user_input']);

// For HTML content (like from a WYSIWYG editor)
$clean_html = wp_kses_post($_POST['html_input']);

// For emails
$clean_email = sanitize_email($_POST['email_input']);

// For URLs
$clean_url = esc_url_raw($_POST['url_input']);

Creating Custom Sanitization Methods

Sometimes, you need a bit more control. Here’s an example of a custom sanitization method for a username:

function sanitize_username($username) {
    // Remove any HTML tags
    $clean = strip_tags($username);
    
    // Remove any non-alphanumeric characters except underscores
    $clean = preg_replace('/[^a-zA-Z0-9_]/', '', $clean);
    
    // Trim whitespace and limit to 20 characters
    return substr(trim($clean), 0, 20);
}

function sanitize_username($username) {
    // Remove any HTML tags
    $clean = strip_tags($username);
    
    // Remove any non-alphanumeric characters except underscores
    $clean = preg_replace('/[^a-zA-Z0-9_]/', '', $clean);
    
    // Trim whitespace and limit to 20 characters
    return substr(trim($clean), 0, 20);
}

Putting It All Together: A Complete Form Processing Example

Let’s bring everything we’ve learned together into a complete form processing example (in functions.php):

add_action('admin_post_nopriv_submit_user_form', 'handle_user_form');
add_action('admin_post_submit_user_form', 'handle_user_form');

function handle_user_form() {
    // Verify nonce for security
    if (!isset($_POST['user_form_nonce']) || !wp_verify_nonce($_POST['user_form_nonce'], 'submit_user_form')) {
        wp_die('Security check failed');
    }
    
    $username = isset($_POST['username']) ? $_POST['username'] : '';
    $email = isset($_POST['email']) ? $_POST['email'] : '';
    $age = isset($_POST['age']) ? $_POST['age'] : '';
    
    $errors = array();
    
    // Validate inputs
    if (!validate_username($username)) {
        $errors[] = "Invalid username";
    }
    
    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $errors[] = "Invalid email format";
    }
    
    if (!is_numeric($age) || $age < 18 || $age > 99) {
        $errors[] = "Age must be a number between 18 and 99";
    }
    
    // If there are errors, redirect back to the form
    if (!empty($errors)) {
        $error_string = implode('&', array_map('urlencode', $errors));
        wp_redirect(add_query_arg('errors', $error_string, wp_get_referer()));
        exit;
    }
    
    // Sanitize inputs
    $clean_username = sanitize_username($username);
    $clean_email = sanitize_email($email);
    $clean_age = absint($age);
    
    // Process the form (e.g., save to database)
    // ...
    
    // Redirect to success page
    wp_redirect(add_query_arg('success', '1', wp_get_referer()));
    exit;
}

add_action('admin_post_nopriv_submit_user_form', 'handle_user_form');
add_action('admin_post_submit_user_form', 'handle_user_form');

function handle_user_form() {
    // Verify nonce for security
    if (!isset($_POST['user_form_nonce']) || !wp_verify_nonce($_POST['user_form_nonce'], 'submit_user_form')) {
        wp_die('Security check failed');
    }
    
    $username = isset($_POST['username']) ? $_POST['username'] : '';
    $email = isset($_POST['email']) ? $_POST['email'] : '';
    $age = isset($_POST['age']) ? $_POST['age'] : '';
    
    $errors = array();
    
    // Validate inputs
    if (!validate_username($username)) {
        $errors[] = "Invalid username";
    }
    
    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $errors[] = "Invalid email format";
    }
    
    if (!is_numeric($age) || $age < 18 || $age > 99) {
        $errors[] = "Age must be a number between 18 and 99";
    }
    
    // If there are errors, redirect back to the form
    if (!empty($errors)) {
        $error_string = implode('&', array_map('urlencode', $errors));
        wp_redirect(add_query_arg('errors', $error_string, wp_get_referer()));
        exit;
    }
    
    // Sanitize inputs
    $clean_username = sanitize_username($username);
    $clean_email = sanitize_email($email);
    $clean_age = absint($age);
    
    // Process the form (e.g., save to database)
    // ...
    
    // Redirect to success page
    wp_redirect(add_query_arg('success', '1', wp_get_referer()));
    exit;
}

Wrapping Up: You’re Now a Form Security Ninja!

Congratulations! You’ve just leveled up your WordPress form-handling skills. By implementing these validation and sanitization techniques, you’re following best practices and protecting your users and your reputation.

The world of web security is always evolving, so stay curious and keep learning.

Happy coding, and if you have any questions, just ask!

It’s a simple function, but it has a few nuances that can drive you crazy until you figure them out. Let’s go over everything.

Syntax and Parameters

The basic syntax of the in_array() function is as follows:

bool in_array ( mixed $needle , array $haystack [, bool $strict = false ] )

Let’s break down the parameters:

1. $needle: The value to search for in the array.
2. $haystack: The array to search in.
3. $strict (optional): If set to true, the function will also check for type equality.

The function returns true if the $needle is found in the $haystack, and false otherwise.

Basic Usage

Here’s a simple example of how to use in_array():

$fruits = array("apple", "banana", "orange");
if (in_array("banana", $fruits)) {
    echo "Found banana!";
} else {
    echo "Banana not found.";
}

In this example, the output will be “Found banana!” because “banana” exists in the $fruits array.

Strict Mode

The third parameter, $strict, is particularly important when dealing with different data types. When set to true, it performs a strict comparison (===) instead of a loose comparison (==).

Consider this example:

$numbers = array(1, "2", 3);

var_dump(in_array(2, $numbers));        // Output: bool(true)
var_dump(in_array(2, $numbers, true));  // Output: bool(false)

In the first case, in_array() returns true because it finds the string “2”, which is loosely equal to the integer 2. In the second case, with strict mode enabled, it returns false because there is no integer 2 in the array.

This Gave Me Trouble

I couldn’t figure out why some searches worked, while others did not.

This works:

// single level array
$array = array(5) {
	["keywords"]=> string(5) "74.51"
	["wordCount"]=> string(1) "0"
	["linkCount"]=> string(1) "0"
	["headingCount"]=> string(1) "0"
	["mediaCount"]=> string(1) "0" }
 }
$test_result = in_array(74.51, $array) // test_result is true

This does not until you reference the sub-array (in $test_result2):

// an array exists within another array
$array = array(6) {
	["width"]=> int(30)
	["height"]=> int(30)
	["file"]=> string(31) "2022/08/icon_mountainbiking.png"
	["filesize"]=> int(1670)
	["sizes"]=> array(0) { }
	["image_meta"]=> array(12) {
		["aperture"]=> string(1) "0"
		["credit"]=> string(0) ""
		["camera"]=> string(0) ""
		["caption"]=> string(0) ""
		["created_timestamp"]=> string(1) "0"
		["copyright"]=> string(0) ""
		["focal_length"]=> string(1) "0"
		["iso"]=> string(1) "0"
		["shutter_speed"]=> string(1) "0"
		["title"]=> string(0) ""
		["orientation"]=> string(1) "0"
		["keywords"]=> array(0) { }
	}
}
$test_result = in_array(0, $array) //test_result is "false"
$test_result2 = in_array(0, $array['image_meta']) //test_result is "true"

Findings:

You must reference the element that contains the array you want to search. You cannot reference the top-level array only and expect it to traverse down through sub-arrays.

Searching in Multidimensional Arrays

While in_array() works great for one-dimensional arrays, it doesn’t directly search nested arrays. To search in multidimensional arrays, you’ll need to use it in combination with other functions or write a custom function.

Here’s an example of how you might search a multidimensional array:

function in_array_r($needle, $haystack, $strict = false) {
    foreach ($haystack as $item) {
        if (($strict ? $item === $needle : $item == $needle) || (is_array($item) && in_array_r($needle, $item, $strict))) {
            return true;
        }
    }
    return false;
}

$users = array(
    array("name" => "John", "age" => 25),
    array("name" => "Jane", "age" => 30)
);

var_dump(in_array_r("Jane", $users));  // Output: bool(true)

Performance Considerations

While in_array() is convenient, it can be slower for large arrays because it performs a linear search. For better performance with large datasets, consider using array_flip() in combination with isset():

$fruits = array("apple", "banana", "orange");
$flipped = array_flip($fruits);

if (isset($flipped["banana"])) {
    echo "Found banana!";
}

This method is generally faster for large arrays because isset() has constant time complexity.

Common Use Cases

1. Input Validation: Check if a user’s input is in a list of allowed values.
2. Filtering Data: Remove or keep elements based on whether they exist in another array.
3. Menu Highlighting: Determine if the current page is in the list of menu items.
4. Permission Checking: Verify if a user has a specific permission from a list.

Conclusion

The in_array() function is a versatile tool in PHP for checking the existence of values in arrays. Unfortunately, I’ve spent many hours trying to debug an in_array() command and wondering why it wasn’t finding a value that was in a sub-array. Seems simple, but it’s easy to forget.

Remember to consider performance implications for large datasets and explore alternative methods when dealing with multidimensional arrays.

As with any PHP function, it’s always a good idea to refer to the official PHP documentation for the most up-to-date information and additional details about in_array() and related functions.

Happy coding!

P.S. Read this if you want to set up your own PHP server in AWS.

We’ll explore how to find shortcodes from various sources such as WordPress core, themes, and plugins. Additionally, we’ll cover how to use shortcodes in both the block editor (Gutenberg) and the classic editor.

Let’s get started

Shortcodes are convenient tools in WordPress that allow you to add features or styled content to your posts or pages without needing to write complex code. Here’s how to use shortcodes created by others:

Understanding shortcodes

Shortcodes typically look like this: [shortcode_name] or [shortcode_name attribute=”value”].

They’re enclosed in square brackets and may include attributes that customize their behavior.

Finding Shortcodes

Shortcodes can come from various sources:

• WordPress core (e.g., gallery, caption)
• Your theme
• Plugins you’ve installed

To find available shortcodes:

• Check your theme’s documentation
• Look in the settings or documentation of your installed plugins
• Use a plugin like “Shortcodes Finder” to discover shortcodes on your site

To find the available shortcodes on your website, check your theme’s documentation, the settings or documentation of your installed plugins, or use a plugin like Shortcode Finder. To install it, go to plugins, click “Add New,” type “Shortcode Finder,” and search for it.

Shortcodes Finder Plugin

First, install this free plugin.

To use the plugin, go to the “Tools” admin section, and find the link called “Shortcodes Finder”.

Click “Tools”, and then “Shortcodes Finder” near the bottom.

In the Shortcodes Finder tool, go to Documentation to find everything or locate unused shortcodes.

If you click on the WordPress front end and do a search, it will display the various shortcodes you can use.

You’ll see some built-in WordPress shortcodes listed.

You have audio, caption, gallery, and others. These are some of the shortcodes built into WordPress that you can use immediately.

How to Reference a Shortcode

How do we actually use shortcodes in a WordPress site? The methods depend on how your site is setup. Your theme will most likely have either a block editor or the classic editor when editing pages and posts.

In the Block Editor (Gutenberg)

While in the area you want to place the shortcode, type “/” to bring up options.

Click on “[ / ] Shortcode”.

Enter your shortcode in the box and hit save.

In the Classic Editor

In the classic editor, you need to go to the Text section of a page (Top right corner of the text area) and manually type out the shortcode.

Simply type or paste the shortcode directly into the content area where you want it to appear and Save the page or post.

When viewed from the front end, the shortcode will be deciphered by WordPress, and the result will be displayed to the user in their browser window.

Using Shortcodes in Widgets

You can also use shortcuts in widgets. To use shortcuts in widgets, go to Appearance, then Widgets.

1. Go to Appearance > Widgets in your WordPress dashboard

2. You can see that this site already uses shortcodes in the “Sidebar 1” widget.

To add another one, click the Add button. Check the shortcode type, then type it in.

3. Click on “+” to add a new shortcode reference.

4. Click on “Custom HTML”. You might have to search for it if it’s not one of the first few.

Type or paste in the new shortcode and hit Save.

Using Shortcodes with Attributes

Many shortcodes accept attributes to customize their output. Check your theme or plugin documentation to see what’s available.

[shortcode_name attribute1="value1" attribute2="value2"]

Here’s an example using a hypothetical “slider” shortcode:

[slider id="homepage" speed="500" arrows="true"]

Here’s a gallery of specific images. The “gallery” shortcode without the IDs attribute will return all images associated with that particular page or post.

[gallery ids="123,124,125"]

Using Shortcodes in PHP code

Let’s say you’re creating a custom theme and need to insert a shortcode directly within the PHP code.

<?php echo do_shortcode('[your_shortcode]'); ?>
//simply replace "your_shortcode" with your actual shortcode and you're set.

Creating Shortcodes in PHP code

This bit is a bit more advanced, but here’s how you can create a completely new shortcode for your theme. The following code would go into your functions.php file.

The new shortcode – [last_10_posts] – will execute the code below and return the most recent 10 post titles.

function last_10_posts_shortcode() {
    // Query for the last 10 posts
    $args = array(
        'numberposts' => 10,
        'post_status' => 'publish',
    );
    $recent_posts = wp_get_recent_posts($args);

    // Start output buffering
    ob_start();

    // Check if there are any posts
    if (!empty($recent_posts)) {
        echo '<ul>';
        foreach ($recent_posts as $post) {
            echo '<li><a href="' . get_permalink($post['ID']) . '">' . esc_html($post['post_title']) . '</a></li>';
        }
        echo '</ul>';
    } else {
        echo '<p>No recent posts found.</p>';
    }

    // Get the output buffer content
    $output = ob_get_clean();

    return $output;
}

// Register the shortcode
add_shortcode('last_10_posts', 'last_10_posts_shortcode');

Troubleshooting Shortcodes

If a shortcode isn’t working:

• Double-check the syntax, including spelling and attributes
• Ensure the plugin or theme providing the shortcode is active
• Check if the shortcode requires any specific setup or configuration

Best Practices

• Don’t overuse shortcodes; they can make your content harder to read and edit
• Keep a list of the shortcodes you frequently use for easy reference
• Always preview your content to ensure shortcodes are rendering correctly

There is additional information on the WordPress site.

By following these steps, you should be able to effectively use shortcodes created by others in your WordPress site, enhancing its functionality and appearance without needing to write complex code yourself.

Good luck!

Sometimes, you may need to delete multiple objects from an S3 bucket efficiently. Here’s how we did it using S3 DeleteObjects and NodeJS.

Assumptions

1. You have some experience with Node.js and can set up your development environment.
2. You know what “S3” and “IAM” are without looking them up.
3. You understand that mass deleting files can be crazy stressful, yet satisfying.
4. You understand that you are responsible for what you do.

Do you fit these criteria? Good, let’s keep going.

Your AWS Environment Requirements

Before you can start using the AWS SDK for JavaScript to delete S3 objects, you need to make sure you have some information regarding your AWS environment:

1. AWS Account: You’ll need to have access to the AWS account.
2. IAM User: You’ll need an IAM (Identity and Access Management) user with the necessary permissions for accessing and deleting objects in the S3 bucket. You need their Access Keys.
3. S3 Bucket: You’ll need to know which S3 bucket you want to delete objects from. Make sure the IAM user has the required permissions for this bucket.

Installing and Configuring the AWS SDK for JavaScript

To use the AWS SDK for JavaScript, you need to install it and configure your AWS credentials. If you haven’t already installed Node.js and npm (Node Package Manager), make sure to do that first.

Installation

You can install the AWS SDK for JavaScript using npm:

npm install @aws-sdk/client-s3

Also, because we’re dealing with credentials, you’ll want to install dotenv-safe.

npm install @dotenv-safe

Alrighty. Let’s do this.

Configuration

There are three main files in this lesson. They could have been combined into a single file, but separating them simplifies things a bit.

After installing the SDK, you must configure it with your AWS credentials. The AWS SDK for JavaScript will use these credentials to interact with your AWS services.

You can configure the SDK credentials using the dotenv-safe library. Create a file named “.env” and update the lines below with your credentials and bucket information:

# credentials
S3_REGION = "us-east-1"
ACCESS_KEY_ID = "AKIX8S45D49DJDH7JUNG"
SECRET_ACCESS_KEY = "f6+wDCaGIadoLdxlsE3d8DsnRv02c7jgo2"

# bucket info.  Leave "S3_FOLDER" value blank if you want to start at the top level
S3_BUCKET = "yourBucketName"
S3_FOLDER = ""

In this script:

• Line 1-4: Your IAM credentials with proper permissions
• Line 7: S3 bucket name
• Line 8: Folder (S3 calls it a “Prefix”) below the bucket listed on line 7. Add a value here only if you want to limit the script to search and delete from this folder (and below).

Listing Out the S3 Objects to be Deleted

Now that your environment is set up and the AWS SDK is configured, let’s explore how to first list out the S3 objects you want to list. Once we limit the list to what we want, we can go on to the next step and delete them.

Here’s how I went about listing the files I wanted to delete:

//this file lists the objects in an S3 bucket.  Max rows is 1000.

import 'dotenv/config';
import { S3Client, ListObjectsV2Command } from "@aws-sdk/client-s3";

let client = new S3Client({
    region: process.env.S3_REGION,
    credentials: {
        accessKeyId: process.env.ACCESS_KEY_ID,
        secretAccessKey: process.env.SECRET_ACCESS_KEY
    }
});

const command = new ListObjectsV2Command({
    Bucket: process.env.S3_BUCKET,
    Prefix: process.env.S3_FOLDER,
    MaxKeys: 1000,
});

(async () => {

    const response = await client.send(command);

    // if you want to limit this list, add code here to change the "response" variable to only include files that fit

        //EXAMPLE 1 - reduce list to items between two dates
            // Define the date range for filtering
            //const startDate = new Date('2022-1-1');
            //const endDate = new Date('2023-1-1');
            // Filter the "Contents" array
            //const filteredContents = response.Contents.filter(item => {
            //    const lastModifiedDate = new Date(item.LastModified);
            //    return lastModifiedDate >= startDate && lastModifiedDate <= endDate;
            //});
            // Update the "Contents" property in the response object
            //response.Contents = filteredContents;
        //EXAMPLE 1 END

        //EXAMPLE 2 - reduce file list to items with "150" in the file name
            const filteredContents = response.Contents.filter(item => item.Key.includes("150"));
            // Update the "Contents" property in the response object
            response.Contents = filteredContents;
        //EXAMPLE 2 END

    //at this point we have the results in a single variable("response") with LastModified, Size, and StorageClass attributes included
    //console.log(response); //uncomment to see the full list

    // We just want the filename so we limit this list to get just the "Key" values
    const keys = response.Contents.map(item => item.Key).map(item => ({ Key: item }));
    console.log(keys);

})();

In this script:

• Line 3-4: Import the libraries
• Line 6-12: Create the connection to AWS and authenticate using the credentials in your .env file
• Line 14-18: Create the command that you’ll send to AWS to retrieve all S3 objects
• Line 22: Send the request to AWS and put the values returned in the “response” variable
• Line 26-37: Example code if you want to reduce the file list based on dates
• Line 39-43: Example code if you want to reduce the file list based on a text value in the file name. Comment out if not needed
• Line 49: This line extracts the file name (“Key“) value from the JavaScript object returned and puts it in a format to copy for deletion.
• Line 50: Logs the list of Keys in the console.

Run this script alone to get the full list of objects to be deleted.

Deleting Multiple Objects With S3 DeleteObject

Now that you have the file list you want to delete, let’s explore how to delete multiple S3 objects efficiently. To delete multiple objects, you can use the deleteObjects method provided by the AWS SDK for JavaScript.

Here’s a sample script to delete multiple objects from an S3 bucket:

import 'dotenv/config';
import { DeleteObjectsCommand, S3Client } from "@aws-sdk/client-s3";

let client = new S3Client({
    region: process.env.S3_REGION,
    credentials: {
        accessKeyId: process.env.ACCESS_KEY_ID,
        secretAccessKey: process.env.SECRET_ACCESS_KEY
    }
});

const command = new DeleteObjectsCommand({
    Bucket: process.env.S3_BUCKET,
    Delete: {
        Objects: [
            {Key: "my-random-image.jpg"}, // if in a directory: "directory_name/file.ext"
            {Key: "wp-content/uploads/2022/08/19185558/some-other-random-image.jpg"},
            {Key: "wp-content/uploads/2023/05/19182148/another-random-image.jpg"}
        ],
    }
});

(async () => {

    const response = await client.send(command);
    console.log(response);

})();

I’ve purposely kept this script’s object list manual since I didn’t want anyone to inadvertently delete more than they wanted. It’s easy enough to automate yourself, or you can ask me how to do it.

You’ll want to replace your list with the list I have on lines 16-18. Just specify the directory and filename.

In this script:

• Line 1-2: Import the libraries
• Line 4-10: Create the connection to AWS and authenticate using the credentials in your .env file
• Line 12-21: Create the command that you’ll send to AWS to define which S3 objects to delete
• Line 16-18: Replace these lines with the full list of the files you want deleted. You would have this list from the response that “list-all-s3-files.js” returned. Make sure it’s formatted correctly.
• Line 23-28: Send the delete request to AWS and display the response in the console.

Run this script alone and all items you listed should get deleted.

Summary

This is a quick and easy way to efficiently delete multiple S3 objects using the AWS SDK for JavaScript in your Node.js application. This can be particularly useful for automating cleanup tasks and managing your S3 resources more effectively.

Also, if you want information on how to set up your own web server in AWS, we’ve done that plenty of times too!

Good luck!

It’s free, so please try it out and let us know if it helps you as well.

https://hiliter.co

The Problem We Needed to Fix

We were always coming across mentions of our products in articles that we knew nothing about. It got us wondering how many other mentions we were missing and knew nothing about. We were spending a lot of time reading through articles and social media and forums because we didn’t want to “miss” someone commenting about our products.

We also wanted an easier way to track our product mentions in news sites and forums. We spend so much time sifting through posts that we needed a better way. We were probably missing someone writing about our business or bypassing links that someone has pointed to you.

Scrolling through endless social media posts is exhausting and impossible to digest everything.  I just want to find the posts that mention my product and company name.  This results in a lot of wasted time, which is why we developed Hiliter Chrome extension. This chrome extension will immediately highlight your keywords and links whenever they exist on any website you visit.

The Solution

With HiLiter Chrome extension, you’ll be able to save time by never having to search for your links or keywords again. You’ll be able to scroll quickly and only stop on those areas that contain your keywords and links.

Potential Users

• Marketing Agencies – It’s an easy way for you to keep tabs on customer mentions in articles/forums
• PR Firms
• OEMs
• Brand Managers
• SEO Specialists
  • Where are you mentioned?  Where are your links on a page?  Are they NOFOLLOW links?
• Venture Capital Firms
  • Keep track of your investment mentions.

It’s free, so please try it out and let us know if you find it useful.

https://hiLiter.co

Thanks!

You Might Also Like

• Follow These 48 best startup blogs to quickly grow your SaaS Business

To help the new startup founder out, we’ve put together a list of some of the best startup blogs that you should be following if you’re looking to grow your SaaS startup. Some are blogs of software and internet companies, but many are independent media sites. All are centered on helping tech companies succeed in the business world and their respective startup industry.

If you’re looking for tech news about other tech startups, there is plenty to choose from as well. The list below is for expanding your knowledge and learning new techniques that will be useful for your business (and maybe a few tech news sites). We’ve put them into categories, but they do seem to overlap in places.

Hopefully, they will save you some time in your entrepreneurial adventure. The need to maintain relevant information is critical – particularly given that the changing world has changed dramatically.

Let us know if we missed a blog that you think should be added.

Digital Marketing Startup Blogs

Digital marketing is the process of using digital channels to promote or market products and services to target customers. Channels include social media, email, search engines, websites, and mobile apps.

The startup marketing blogs we recommend are:

1) Marketing Charts

MarketingCharts is first and foremost a hub of marketing data, graphics, and analyses. They are a leading data source cited by many of the top news agencies. Did you know that YouTube usage by adults is on the rise? I did because I read this site.

This is also a great resource if you need information for a blog post or presentation deck. The site is updated multiple times per week.

2) CMSWire

They obsess over the evolving digital customer experience, customer data, and digital experience optimization universe.

This site is updated daily.

3) Content Marketing Institute

As the name suggests, CMI is all about content marketing. They provide helpful resources, tips, and advice on how to create and market engaging content that will attract and convert leads into customers.

The site is updated daily.

4) Econsultancy

The latest articles on global digital marketing and e-commerce from Econsultancy’s award-winning analysts and experts.

This site is updated a few times per week.

5) MarTech

MarTech is on a mission to educate marketers about marketing technology and strategy through news and feature reporting, newsletters, research reports, live conferences, and digital events.

This site is updated multiple times per day.

Technology & Tech News Startup Blogs

We have to see what’s going on outside of our own business from time to time. Here are the sites we frequently read:

1) HackerNoon

How hackers start their afternoon. HackerNoon is a free platform with 25k+ contributing writers. 100M+ humans have visited HackerNoon to learn about technology.

HackerNoon is updated multiple times per day.

2) ForEntrepreneurs

Run by David Skok, a Venture Capitalist with Matrix Partners. There is a wealth of great articles here that will give you every advantage you need to succeed.

The site is well laid-out and the articles are well written.

3) TechCrunch

TechCrunch has been around for a long time and remains one of the best sources for tech news. They report on the business of technology, startups, venture capital funding, and Silicon Valley in general.

Many updates are made throughout the day on this site.

4) ReadWrite

Self-described as “The Blog of Things”. ReadWrite writes articles slanted toward the tech-savvy reader.

This site is updated daily.

5) Recode

The tech column of Vox Media. Recode explores how the digital world is changing — from keeping Big Tech accountable to explaining how decisions in Silicon Valley affect your daily life.

Recode is updated daily.

6) VentureBeat

VentureBeat covers transformative tech. They help business leaders make smarter decisions.

This site is updated many times per day.

7) GigaOm

GigaOm provides research from engineering-led practitioners to help you innovate, upskill, and be ready for what’s next.

You will spend a lot of time wading through all the information on this site.

8) Ars Technica

Serving the Technologist for more than a decade. A combination of IT news, reviews, and analysis. We love this site.

Ars Technica is updated many times per day.

SEO Startup Blogs

SEO (Search Engine Optimization) is the process of optimizing a website for Google search with the goal of earning higher web traffic levels and improving the visibility of the site. A strong SEO strategy can also help to improve conversion rates by making it easier for potential customers to find your website.

SEO strategies focus on improving both on-page and off-page ranking factors. On-page SEO tactics include optimizing title tags, meta descriptions, and header tags. Off-page SEO tactics include link-building and social media engagement.

Staying on top of Google’s constantly changing algorithm is critical. These blogs can help you with that.

1) Surfer SEO

Surfer is our go-to tool for SEO purposes. Their blog is solid information about on-page, content creation & SEO tips.

They generally provide new tips a few times a month and it will often include instructions on how their tool can make things easier (which it does).

2) The Moz

The industry’s top wizards, doctors, and other experts offer their best advice, research, how-tos, and insights—all in the name of helping you level up your SEO and online marketing skills.

This site is updated every few days.

3) Neil Patel

Neil Patel is regarded as one of the most knowledgeable SEO experts out there. He has great articles and can help analyze your website to identify SEO errors, keyword opportunities, and competition.

His site isn’t updated daily, but there are a lot of articles to go through.

4) RankMath Blog

One of the best WordPress plugins for SEO brings you one of the best blogs as well. Their SEO blog provides you with tutorials and guides on how to improve SEO and take your rankings to the next level. They have quite a few extensive tutorials.

This site is updated weekly or so.

5) CopyBlogger

Their tagline is “We Help Writers Succeed in the Creator Economy”. So few people can really write well which is why we frequent this blog. The insights you get from these articles are empowering and enlightening. Your SEO will benefit greatly from improved content, and this blog helps with that.

This site is updated a few times per week.

6) Ahrefs Blog

Ahrefs is a critical tool for SEO purposes. Their entire business helps you rank higher in Google. You’ll find a wealth of information here on how to rank higher and how their tool can help you save time.

They’ll typically use videos in order to help with their blog posts.

This site is updated a few times per week.

Email / SMS Marketing Startup Blogs

Email Marketing is one of the most effective ways to reach your target audience and build relationships with them. Email Marketing can also help you to increase brand awareness, drive traffic to your website, and generate leads.

1) Litmus

Get email best practices, how-tos, and more in the Litmus blog. There’s a lot of them here.

There are new articles and tutorials every few days.

2) SendGrid

Read the SendGrid blog (The Full Send) to learn how to maximize your customer reach, and how to fully take advantage of the capabilities that SendGrid offers.

There are new articles every week or so.

3) Email Octopus

Email tips, inspiration, and insights from the team at EmailOctopus​. They want to make email marketing easier for you and have articles and case studies.

The blog updates have slowed down recently, and are now updated about once a month.

4) AWeber

Find a wealth of valuable advice, tips, and tricks to grow your email list, increase sales, improve your emails, and landing pages, and so much more.

New articles are added and updated every couple of days.

5) Mailchimp

From one of the biggest email software providers. This is less of a blog and more of a knowledge base. Get advice on creating and sending effective campaigns.

We’re not sure of the frequency that new articles are added, although the information seems updated.

6) The Email Marketers

Get the latest email marketing strategies and techniques in e-commerce to grow your online sales while automizing your workflows.

Updates are a bit sporadic. They seem to be about every month or so.

7) Designmodo

Mostly design-centric articles to help your email design skills. They help you get better at web design and email marketing: detailed tutorials and guides, case studies, and opinions from industry professionals.

You can see new articles roughly every week or so.

Social Media Startup Blogs

The best Social Media blogs provide readers with useful, actionable tips and advice on a wide range of topics related to social media. They offer a place for readers to connect with other like-minded individuals, share their own experiences, and learn from the successes and failures of others. And of course, they’re updated often with fresh content.

Here are some we like:

1) SocialMediaToday

The latest news, trends, and tips in social media. If it revolves around social media, it’s probably here.

They provide daily updates.

2) Social Media Examiner

Their tagline is “Your Guide to the Social Media Jungle”. They help millions of marketers discover how to best use social media marketing to connect with customers, generate awareness, and increase sales. You’re going to learn something every time you go here.

Expect new articles every day.

3) The Social Media Hat

Founded by Mike Allton in 2011, The Social Media Hat is an award-winning resource for businesses around the world. Here you’ll find guides to plan successful virtual events, reviews of the best tools, and in-depth articles on social media strategies and tactics.

It is updated approximately every month or so.

4) Jeff Bullas

Helping business and personal brands with digital marketing including social media with Blogs, Twitter, Facebook, LinkedIn, YouTube, and Search Engine Optimization. Their goal is “To optimize your brand in a digital world”.

He seems to update the site every week or so.

5) AdEspresso

Owned by HootSuite. They claim that their blog is the best resource to stay up to date with Facebook & Google Ads news and tactics for successful campaigns that convert!

They seem to update the site with a new article every week or so.

Finance / Legal / Venture Capital Startup Blogs

Financing your startup can be complicated and tiresome. If you are in this phase, you probably have plenty of questions. Be sure to view our list of best venture capital firms. The top Venture Capitalists provide funding for early-stage startups and help them to grow and scale their businesses.

Some of the best blogs for more information can be found below.

1) SecureDocs

Stay on top of the latest tips, trends, and best practices for M&A, fundraising, and other business events.

2) Red Rocket VC

Red Rocket can help your business “blast off”!! Our Partners are proven CEOs and CMOs, that have already mastered the same growth challenges you are experiencing. They can help you with your growth strategy, execution, or financing needs such as venture capital. Check out their free e-books such as “101 Startup Lessons”.

Updates occur every month or so on this site.

3) Andreessen Horowitz

Commonly referred to as “a16z”, this is the blog/site of one of the biggest Venture Capital firms in Silicon Valley. There’s a lot of wealth in these articles, and they are updated daily. Check out their podcast as well. Good stuff.

They have updates daily on this site.

4) First Round Review

This is a startup blog from First Round Capital and is made up of mostly guest posts from experts in their field.

There’s a wealth of great information here, and the articles are well-written.

5) Tomasz Tunguz

Tomasz Tunguz is a VC at Redpoint and writes a blog post or two each week. Topics include how to raise funds, KPIs that matter, and other questions that startup founders might need answering.

The articles are to the point and without the fluff. Just the way we like it.

6) OnStartups

Dharmesh Shah maintains this site. He’s an Angel Investor, and co-founder of HubSpot. He knows what he’s doing.

This one has waned a bit with the updates, with only three new blog posts in 2022. It still has a wealth of information that is still very relevant.

Startup News Sources

While it’s important to see what the rest of the world is doing, we typically hit these once a day or so.

1) TechCrunch

TechCrunch has been around for a long time and remains one of the best sources for tech news. They report on the business of technology, startups, venture capital funding, and Silicon Valley in general.

If you want to know the details of what’s happening in the world of tech the minute it happens, this site is for you.

2) Young Upstarts

Young Upstarts is an online business resource for startup entrepreneurs, small business owners, idea people, and intrapreneurs seeking change within their organizations.

They have daily updates on this site.

3) Microsoft for Startups Blog

Learn from founders who’ve been there before. Accelerate your startup with Microsoft for Startups Founders Hub.

There are many good articles here that often help you use Microsoft products. Surprise! Many of the guest authors have partnered with Microsoft.

4) StartupNation

Want to learn how to start a business? StartupNation has the resources you need to ensure your success.

This is a great resource that is updated daily.

5) Tech Stars

Techstars is a global platform for investment and innovation. They connect entrepreneurs, investors, and corporations. This blog contains ideas & insights from the Techstars network.

There are many sections to this blog, and most seem to be updated every week or so.

6) The Startup Magazine

The Startup Magazine aspires to educate and inspire startups. They provide advice, access to business tools, and tell great entrepreneur stories.

It’s not our favorite layout, but the site is updated pretty much daily.

7) Killer Startups

Great place to showcase your app and read articles from other founders.

Update daily with shorter, to-the-point articles.

International Startup News Sources

1) StartUs Magazine

Europe’s leading source on daily happenings in the startup community, reaching over 400.000 people monthly.

This blog/site has a section for pretty much every area a startup founder may need, and it’s updated daily.

2) YourStory

This is India’s biggest platform dedicated to fostering the startup ecosystem via entrepreneurship-related stories, resources, products, research reports, and more.

It’s updated daily.

3) Startups.

Starting a business? Startups is the UK’s leading independent, online resource for anyone starting and growing a business. Find independent advice, tools, events, and information for new businesses, start-ups, small businesses, and ambitious entrepreneurs.

It’s updated daily for the most part.

4) e27

Get access to insights, updates, and resources that let you learn more and connect with investors and startups in Southeast Asia.

The site is well laid out, and updated daily.

Conclusion

There you have it! These are some of the best startup blogs that you should be reading if you’re looking to grow your SaaS startup.

Please let us know your thoughts and if we missed any!

You Might Also Like

• The 21 Best Social Proof Tools to Improve Your Business

Launching a new web server at AWS (Amazon’s cloud service) can be a daunting and confusing process. There are many things to consider, from choosing the right platform to configuring security settings.

We’re going to explain what is EC2 and cloud computing. Then we’re going to show you how to launch a web server in Amazon Web Services(AWS cloud services) in just 10 minutes. We’ll walk you through the steps, and provide tips for optimizing your setup.  We’ve removed all the noise and provided you with the core details so you can have your own server set up correctly in a very short time.

What is Amazon EC2?

Amazon EC2 stands for Amazon Elastic Compute Cloud. It’s the service on Amazon Web Services that allows you to “create and rent” a virtual server (or Virtual Machine).  AWS cloud allows you to create, replicate, update, and delete server instances in minutes. Through your AWS account, you can create on-demand instances using scalable computing capacity. You can scale your entire organization’s infrastructure with a simplicity that did not exist just a few short years ago.

Perhaps you’d like to create a new AI tool that utilizes OpenAI’s GPT-3 engine. Then creating an Amazon EC2 instance is a good place to start.

Amazon EC2 Pricing

For this demonstration, we’ll be using the Free-Tier setup for most options, so the cost will be near zero. Please understand that “Free-tier” doesn’t always mean absolutely free. There are limits to what is free and these limits are set pretty low. From the Amazon EC2 website:

If you need to “guesstimate” your costs for your server instances, Amazon has an AWS Pricing Calculator that will help you. Obviously, overall costs will depend on the horsepower of the virtual machine you set up and for how long you keep it running.

Features of Amazon EC2

• Scalable computing capacity – Amazon EC2 allows you to increase or decrease capacity in minutes
• You have complete control – you have complete control of your instances
• Reliability – You are using Amazon’s cloud computing experience and their virtual servers architecture.
• Secure – Amazon’s infrastructure is one of the most secure systems in the world.
• Inexpensive – You can create an Amazon EC2 server instance and only use it (and be charged) for one hour per day. Perhaps you want to create a proof of concept server instance for a few days and then delete it. It’s simple, quick, and cheap to do that.
• Easy to begin – There’s no lengthy installation of software and manual handling of a server. Everything is done via the Amazon Management Console website and takes minutes to complete.

So there are numerous benefits to creating a cloud computing server instance in Amazon EC2. Are you ready to get one set up quickly? Let’s do this!

Step 1: What Are Key Pairs

Technical Answer: Key pairs are used to authenticate SSH connections to your instances. A key pair, also known as a “.pem” file on Linux and Unix systems, consists of a private key and a public key. The private key is kept on your local computer and should be securely protected. The public key is uploaded to AWS cloud and placed on your Amazon EC2 (Amazon Elastic Compute Cloud) instance. When you connect to your instance using SSH, the client software presents the private key for authentication. If the server recognizes the public key that corresponds to the private key, it authenticates the connection.

Simpler Answer: AWS uses a “Key Pair” combination that is unique to you for security access to pretty much everything AWS. You need to create this combination (which we show you first) in order to control your web server.

The Key Pair is completely separate from your username/password combination that you use to log in to the AWS web portal.  AWS defines a Key Pair as so: “A key pair, consisting of a public key and a private key, is a set of security credentials that you use to prove your identity when connecting to an Amazon EC2 instance.”

The Key Pairs is how AWS makes sure you are who you say you are.  It allows you root access to your servers, which means full administrative access.  Do not lose these or share them with strangers.

Create Your Key Pairs

1. Sign up for an AWS account using the AWS Management Console(or sign in if you already have an AWS account) at https://aws.amazon.com
2. In the Search Bar at the top of the page, search for “EC2” or “Elastic Compute Cloud”.  Click on the result that says “Virtual Servers in the Cloud”.  It should be the top result.  Click on it.  Currently, it’s located at https://console.aws.amazon.com/ec2/

1. In the left navigation column, under “Network & Security”, click on Key Pairs.

1. Click on the “Create key pair” button on the top right.
2. Use the following information:
   1. Name: “My AWS Super Secret Key Pair”
   2. Key pair type: “RSA”
   3. Private key file format: “.pem”
3. Hit the “Create key pair” button.

The file should automatically be downloaded to your computer.  This is the only time that you’ll have access to this file.  It will never be created again.  Store it someplace safe.

Step 2: Create an Amazon EC2 Instance

Now the fun part. We get to create our own server and have it ready in a matter of minutes. Let’s do this.

Select the Region That Your Server Will Reside

Select a region at the top right.  This is the location that your Web Server will actually reside.  In North America, just choose N. Virginia for this example. Once we select the region, we don’t want to change it again during this tutorial.

A few things about AWS regions:

1. Each AWS region is built to be isolated from all other AWS regions.  This allows for the greatest possible fault tolerance and a high level of stability in the region.
2. If you have a majority cluster of end-users in a particular geographic location, you might choose to have your server close to them.
3. It’s also important to know that not all resources and functionality exist in every region.  The isolation that exists means that AWS rolls out functionality to regions separately.
4. Also, your Console Home is specific to a Region.

Select an Amazon Machine Image (AMI)

Let’s go back to the main Amazon EC2 page. Search for EC2 in the search bar at the top of the page.

Select “Instances” in the left-hand navigation. This is the area where you will maintain all of your on-demand instances once they’re set up. Go ahead and click on “Launch Instances” in the top right corner.

This next screen is where you will select the size and power of your server.

Start by naming your new server. This is a name for display purposes, so make it easy. I might name it: “Ubuntu with PHP #1”, or “Windows for C# Development”. The name is actually a “tag”, and it can be altered later if you desire.

The next area is where you’ll be presented with AMI options.  AMI stands for Amazon’s Machine Image, and these are basically pre-configured servers with various operating systems.  Do you want a Microsoft Windows server or Linux or something else? This is when you make that decision.

We’ll stick with the “Quick Start” tab and click the box that represents the operating system you want running your server. The drop-down box immediately below will change and give you the list of AMIs that Amazon recommends. Free Tier is what we’ll use for this example. These are great for development purposes or for simply learning AWS services.

I use both Windows-based servers and Linux-based servers.  If you’re planning on running applications that need PHP and MySQL, then consider choosing one that has that pre-installed.  But you can always install it afterward also…just trying to save you some time.  When you’ve located the server AMI you want, select it in the drop-down.

Be Careful!

If you search for a different AMI or click on “Browse more AMIs”, you’ll see a lot of configurations submitted by outside companies.  They typically have a price associated with them that can be quite steep.

Select your Amazon EC2 Instance Type

The next area is where you choose an Instance Type.  This is the power behind the server. Since we’re going for Free Tier, select “t1.micro” or “t2.micro” in the drop-down.

Assign Your Key Pair

Remember that Key Pair you created first? You will need to assign to this instance at this point.  Select the key pair from the drop-down that you just created.  You’re almost done.

Adjust Network Settings

Checkmark the two bottom boxes that say “Allow HTTPs traffic from the internet” and “Allow HTTP traffic from the internet”.

Finally, click on the orange “Launch Instance” button on the right. Boom!  Your server is being created!  This will take a couple of minutes but we can continue with the configuration at the same time.

Step 3: Add an Elastic IP to Your Server

Let’s assign an Elastic IP address to your server instance.

1. In the left navigation column, under “Network & Security”, click on Elastic IPs.

OPTION 1

Your screen will probably be blank, but if there are Elastic IP addresses allocated to your account, you’ll see some here.  They won’t have an Associated Instance ID value in that column like below.  If there are no values on this screen or no unassociated Instance IDs, jump to OPTION 2.

You can use those Elastic IPs for your new server.  Just click on the IP address, and then click on the “Associate Elastic IP address” button.

 Select an instance from the dropdown.  The IP address then should populate in that respective field as well.  You shouldn’t have to type anything in these fields.

Click on the “Associate” button at the bottom.  You should be good to go.

OPTION 2

1. From the main Elastic IP address screen, click on the “Allocate Elastic IP address” button in the top right corner of the main screen.
2. The next screen will populate with the correct information already.  Use “Amazon’s pool of IPv4 addresses”.
3. Click on the “Allocate” button at the bottom.
4. You should see the screen below.  Select an instance from the dropdown.  The IP address then should populate in that respective field as well.  You shouldn’t have to type anything in these fields.

Click on “Associate” button at the bottom.  You should be good to go.

Step 4: Add Security Groups to Your Server

You actually already added a few Security Groups when you created your server.

Creating a security group is just the first step to securing your instance.  You have to give the security group rules in order for it to do anything.

1. In the left navigation column, under “Network & Security”, click on “Security Groups”.

You probably have a Security Group in your list called launch-wizard-1 or something similar.  Regardless of the name,  click on it.

Two Rule Types – Inbound and Outbound

You’ll need to create inbound rules and outbound rules for your server.

Inbound

Traffic coming INTO your server.  When a person is requesting a webpage on your server, that is INBOUND traffic.  The request is coming IN.  Your server currently has no Inbound rules by default, so nobody can access anything on your server yet.  All traffic will be blocked.  We’ll fix that in a moment.

Outbound

Traffic originating on your server but sending OUT a request to another server for some reason.

We’re going to allow all outbound ports.  Your AWS server should come like this as the default.

Incoming Rules to Set Up

If you have a Linux-based Server, add the following Inbound Rules.  Click on the “Edit inbound rules” button to add them.

If you have a Windows-based Server, add the following Inbound Rules.  Click on the “Edit inbound rules” button to add them.

If you want to include FTP access on your Windows-based server, add it in as well.

Outbound Rules to Setup

The below rules are standard for both Linux-based and Windows-based Servers.  This should already be present, but add it if it’s missing, click on the “Edit outbound rules” button to add this one rule.

Congrats!  People should now be able to access your server!

Step 5: Accessing Your Server

You are now free to add files, install your personal software, and configure your server however you want. But how do you do that? It depends on the operating system you chose when setting up your instance.

From your EC2 Instance screen (found in the left navigation), click on your Instance details, and find the value for “Public IPv4 DNS”.  It should look something like “ec1-23-456-789-555.compute-1.amazonaws.com“.  That is your official server name to use in most situations.

Windows-Based Server

You’ll probably want to set up a Remote Desktop Connection.  For that:

1. Go into your Instance details
2. Click on the “Connect” button at the top of the page
3. Click on the RDP client tab

1. Download the remote desktop file.  You’ll want to take note of your “username”, and you need to generate your password value.  For this, you need to enter your Key Pair and your password will be given to you.

You should be able to now click on your remote desktop file and use your credentials to access your new server!

Linux-Based Server

Your PEM file is fine for OpenSSH access, but for PuTTY use, you’ll need a PPK file.  We can convert the PEM to a PPK file.  Luckily the process is simple and has been documented here.

Step 6: Smart Items To-Do

Create an AMI

This isn’t required but certainly is good to have in case something happens to your server. It’s basically an image of the server that you can use as a restore point or for replication purposes if you want all the servers to be congruent.

The full instructions will be in a later blog post, but if you click on the “EC2 Image Builder” button at the top of the page, it will get you started.

Having an image of your server allows you can restore another server at exactly this point and configuration next time.  Boom!

Setup a Monitoring Service

Go here to set up a free monitoring service. You need something to tell you if your server crashes and becomes unreachable. Trust us… you want this. If you create any scheduled jobs on your new server, you’ll want to monitor all your Cron jobs to make sure they are functioning as expected.

Once your website is up and running, be sure to add some free social proof to it so you can grow your audience!

Conclusion

Congratulations! You now have a fully functioning web server hosted in the cloud at AWS.

Please let me know if you have any questions at all and I will do everything I can to help you out.

A Little History

In the late 1990s, the major search engines would spend all their time aimlessly spidering the web and filling up their databases with what they found.  Search results wouldn’t necessarily  contain the the best sites, just the ones that they currently had in the system.   They eventually began allowing you to submit your URL to them, which quickly created a queue of up to six months long to get your site indexed.  It was incredibly slow and inadequate for the rapid growth of the internet.

Now, the major search engines want you to do do a bit more work to categorize and actually tell them what pages are important.  they are requiring website owners to create an index of all the relevant pages within their site, and submit that to them.  This is where XML sitemaps came in – they provide a way for website owners to submit a list of their pages to the search engine, telling them which ones are most important so that they can be indexed more thoroughly.

What is a sitemap?

A sitemap is an XML file that lists all the URLs for a website. It also includes information about each URL, such as when it was last updated and how important it is relative to other URLs on the site.  This information helps search engines index your website more thoroughly and accurately.  It might look like this:

What are the benefits of Creating a sitemap for your website?

Well, it’s important to note that Google and Bing probably won’t include your site into their database unless you start creating a sitemap.  There are a few exceptions to this but for the most part, this rule is the law.

It is also an important way to inform search engines of all the pages on your site, so they can be included in search results. Search engines use a variety of factors to determine how important each page is, but they don’t index every page on your website automatically. Creating a sitemap helps ensure that more pages from your site will be included in search results.

So let’s create a sitemap!

How can you start creating a sitemap?

There are many ways to begin creating a sitemap.  You could hand code them, use an online generator, or look for plugins that will help you automatically generate one in your CMS of choice.

Check to see if a sitemap already exists

If you are using a CMS like WordPress or Joomla, they might have already create a sitemap for you.

Try to access https://www.yourdomain.com/sitemap.xml or https://www.yourdomain.com/sitemap

If you see an XML page already created, that’s awesome!  The hard work is already done.  If not, a plugin probably exists that will do this for you.  Search for one within your CMS to get this created.

Creating a Sitemap Manually

If you’re not too familiar with XML, hand coding a sitemap can be tricky.  There are online tools that will create one for you such as:

https://www.xml-sitemaps.com

https://www.sureoak.com/seo-tools/google-xml-sitemap-generator

All you need to do is enter in the URL of your website and it will generate an XML file for you.

Having your sitemap update auto-magically

Now that finished creating your sitemap, it’s important to keep it updated.  If you make changes to your website and don’t update your sitemap, the search engine might not be aware of the new pages.

This one requires a bit of programming knowledge, but is great at getting new site updates into Google and Bing within days.  If you have a blog, or have consistent updates to your site, update your sitemap to let Google know about them.  It is best practice to update your sitemap at least once a week.

For this blog, we have each blog post added immediately to our sitemap with name, url, and updated date.  This way, as the search engines hit our sitemap daily, they see that the new blog posts and immediately add them to their database.  We have seen a tremendous spike in traffic since implementing this method.

Facebook does this with your profile pages.  The search engines know about them quickly, which is why your Facebook profile is a link directly from within Google.

Updating your website with your sitemap

Ok, so you have a sitemap created.

1. Make sure it’s named “sitemap.xml” (Search engines actually search for it with this name)
2. Put it in the root folder of your website.
3. Verify that you can access it at – https://www.yourdomain.com/sitemap.xml

Submitting your sitemap to Google and Bing

Now that you finished creating a sitemap and placed it on your website, it’s time to update Google and Bing.  To do this, log into their respective webmaster tools:

Google Webmaster Tools: https://search.google.com/u/1/search-console

Bing Webmaster Tools: https://www.bing.com/webmasters/home

Once logged in, find the Sitemaps area (currently on the left navigation).

Google – 

Bing – 

Within this area, submit the sitemap URL.  You should be able to quickly see if the format is acceptable as Google and Bing hit your sitemap.

While you’re in there, be sure to check out all the other tools you can use to utilize the search engines to their fullest.

Congratulations!

You did it! You have successfully created a sitemap and submitted it to Google and Bing. Now it’s time to wait for them to index your website. In the meantime, continue optimizing your website content and adding new pages/posts. The more quality content you have, the better chance you’ll have of ranking higher in search engine results pages (SERPs).

Don’t forget your can use our free SEO Ranking tool to make sure your pages are optimized for Google and Bing.

If you have any questions or need help, please don’t hesitate to contact us. We’re more than happy to assist!

You Might Also Like

• The 21 Best Social Proof Tools To Improve Your Business

Why you absolutely need a Server status page

Most importantly, a status page can help prevent unhappy customers becoming ex-customers.   It keeps a level of open-communication that is critical to great customer service.

If you’re not sure if you need a status page, ask yourself these questions:

• Do we experience outages or downtime that I would like to communicate to our customers?
• Are our customers frequently asking me about our service status?
• Do I need to proactively answer customer questions about our service reliability?

If you answered yes to any of these, then you need a status page.

You might think… I don’t want someone to know when my site goes down!  That will publicize that I’m having troubles.  But the opposite has actually proven true.  Being forthcoming with this information actually improves customer relations.  Your customers might rely on your application to do business themselves, and helping them understand the situation will go a long way with setting expectations with their own clients.

Creating and maintaining a status page doesn’t have to be difficult. There are many services available that can help you get started. In addition, there are many resources online that can help you create an effective page. Gravyware’s Monitoring free tool provides you an excellent one to use.

If you’re not sure where to start, sign up for a free account and you can get set up quickly and easily.

Successful uses of a Server Status page

There are numerous businesses that have successfully used a status page to improve their customer service. Some notable examples include:

Twitter

In 2011, Twitter was suffering from routine outages that impacted users around the globe. They were able to effectively communicate with their customers through implementing a status page which helped avoid any additional PR disasters.

Twitter’s Status Page

Netflix

Netflix has been known for its poor customer service in the past. However, they turned things around when they implemented a comprehensive status page strategy in 2014. The page was updated regularly with information about outages and other disruptions in service.

Netflix Status Page

Dropbox

Dropbox had an outage in 2013 that affected millions of users worldwide. The stress of the outage was equal to the customer relations nightmare. A simple status page was implemented that would give updates to users and proactively communicated with their users while the outage was corrected.

Dropbox Status Page

A Server Status page shows transparency

Having a status page is essential for maintaining your company’s reputation. Customers value transparency and will appreciate knowing what is happening with your service. A well-maintained status page can even help prevent bad press in the event of an outage.

A well-maintained status page is also pro-active.  It shows your customers that you want them to know about issues so that they have time to prepare for their own customer communications.

A Server Status page can save you money

It will cost you a lot of money to react to customer calls and unplanned events.   A status page can help you prevent these types of events from happening in the first place. Having a page that is always up-to-date with your latest information will let your customers know that you’re reliable and proactive.

A Server status page can drive more business

Of course, a status page can also show potential customers your site reliability.   It should show uptime  and downtime statistics, and information about your service providers.

It gives you some legitimacy

Savvy customers have become use to seeing a link to a status page for the best companies.  They realize the risks of using an outside company for a service and may actually prefer to use a business that is forthcoming with server status information.

What not to include on your Server Status page

There are a few things you should avoid including on your status page. Personal information should not be published. You also don’t want to share any confidential company information that is not already available to the public.

Many companies do not want to include a “contact us” option on their status page.  The reasoning is that you want users to reference the status page as the communication method instead of reverting to email or another means.

Finally, do not include internal system’s status on an external status page.  Outside customers do not need to know that your internal chat program is having issues.  This should be broadcast on a separate “internal only” status page (Gravyware has a password-protection option for you to keep a status page private).  The exception to this is if an internal system failure is impacting an external system.

How to use your Server status page to improve customer service

Once your status page is set up, it’s important to use it effectively. The first step is ensuring that your contact information is correct and easily found.  You should also make sure that all of your social media links are included on the page.

In addition, you’ll want to ensure that outage information is updated as soon as possible. This will help customers avoid any confusion or misinformation.

Finally, be sure to keep an archive of past outages and incidents for future reference. Doing so can help you improve your service going forward.

Setting up a Server Status page for your business

As mentioned previously, there are multiple companies that provide status page options for you.  Some status pages are manually updated and some are automated.  Gravyware Monitoring’s free option is super simple to setup, and connects with the site monitoring service offered (so it’s automated).  We particularly like the automated version as it adds to the transparency impact mentioned above.

Whichever option your decide upon, make sure you choose a good URL for the page itself (typically you choose through the status page admin area), and make it search engine accessible.

You will also want to link to the status page from your main site.  Think of it as another page making up your main application.  Gravyware’s status page is located here.  We include it in the footer throughout all of our sites.

Finally, customize it as much as allowed so that it truly looks like your creation.

Conclusion

A status page is an important part of any company’s communication strategy. It can help you with communication during outages, ultimately save you money, and improve your customer service all at the same time.  If you have any questions or comments regarding this blog post please reach out to the Gravyware team.

Good luck!