Post vs Page

WordPress offers two way in creating content – post and page. But these two are common mistaken one from the other, when you’re just getting started, it can be difficult to know when you should use a post and when you should use a page. So what is a Post and what is a Page really?

Post in nature has official publish date and are displayed by date on your site’s blog page. If you want to post a blog or news then you should create a post instead of a page. While pages do not have publish date and are meant to be static. Common examples of pages are “Contact” and “About” page, these pages doesn’t need publish date or should not be put inside blog area. So we can assume that posts are timely content while pages are timeless static content.

To create pages and post make sure to do the following steps:

1. Login to your site WP admin area: yoursitename.com/wp-admin/

2. Select Post panel then Add New, if you want to create new post.
     Select Pages panel then Add New, if you want to create new page.

Post content editor is different from page content editor. Please see the following:

3. When you create a WordPress post, you have the option to assign it – Categories and Tags.

Categories and tags help you organize your posts, this will make it easier for your readers to find the content they’re interested in. Each category and tag archive page lists all the blog posts that fit that category or tag by their publish date. Example of this scenario is creating category named travel, and food – while creating a post you can either set it to any of those category and when user pick a category in your blog then they can easily see what they wanted to read just by basing on the category they picked.

3. When you create a WordPress page, you can’t set it to have category or tags instead you can organized it hierarchically.

By hierarchically means you can make one page a “parent” and another page a “child” or sub item. This helps you to group related pages together.

Creating sub item or child on a page can affect the URL permalink structure – will cover that permalink structuring below. For example, if the parent page is located at “site.com/parent”, the child page would have a URL of “site.com/parent/child”.

4. You can add settings on your post or page, basically post and page has the same setting in terms of setting Featured Image and Settings

Featured Image is the front image when you open your page or post. You can either put sidebar or not when you create page or post. You can set it under settings. Hide and unhide navigation and footer too.

In creating post you can also set the publisher or author of that post. But you can’t do that in pages

5. After picking what you want, then you can now write the content. You can either Save as Draft – if you don’t want to see it on your site or you can click Publish if you want to publish or show it in your site. Either way, both are saving your file.

Each post or page you create will have its own unique URL or on WordPress so called Permalinks. In the discussion below I will discuss how to work with permalinks. Will also discuss how to set the setting for your Reading list.

Reading Settings

The Reading settings control how your blog is displayed to visitors. To access reading settings do the following:

1. Login to your site WP admin area: yoursitename.com/wp-admin/

2. Select Settings panel then Reading.

Modify the reading settings. I will discuss the different settings.

Homepage displays, you can either choose latest posts (blog) as your homepage or static page. When choosing a static page, you can pick Homepage and post page you want to display.

Blog pages show at most lets you choose how many blog posts are displayed per page. The default setting is 10 posts per page.

If you are planning to increase the number of blog posts, you should keep in mind the possible impact load times on your blog, since you will be loading a lot more data with each page. The default setting is 10 posts per page to ensure fast load times.

Syndication feeds show the most recent lets you set how many blog posts will be sent out at once via your RSS feed. The default value is 10.

Every article displayed in your feed, you can pick if you will show the Full text or just the Summary. Full text means showing the entire content of your post while summary shows first 55 words with an option to “Continue Reading” just below the summary post.

You can discourage search engines from indexing your website from within the WordPress dashboard.

3. If you set all the necessary changes you want for your reading setting then you can click Save Changes.

Permalinks Settings

Permalinks are part of the setting configuration you need to setup or continue as default in your WordPress site. These are permanent URLs to your pages, blog posts, categories, and tag archives. Permalinks are web addresses used to link to your site content. Each permalinks or URL to each post are unique, permanent, and can’t be change, that’s why its called permalink. 

BWordPress by default uses web URLs which have day and name in them however you can modify them as you wish. WordPress offers the ability to custom create URL for your permalinks and archives. In that way, you can improve the esthetics, usability, and forward-compatibility of your links. To setup permalinks you need to do the following:

1. Login to your site WP admin area: yoursitename.com/wp-admin/

2. Select Settings panel then Permalinks.

These are the common permalink settings that you can find in WordPress, when you scroll down to that page you can see multiple advance settings that you can modify but for now I would like to focus on common settings. Please don’t modify the advance settings unless you are a pro. 

You can pick from those common setting lists and your URL will be based on that format. If you don’t want any of those predefine URL structure, you can custom create it under Custom Structure. For example, using /blogs/ as your category base would make your category links like http://example.org/blogs/uncategorized/. If you leave these blank the defaults will be used.

3. If you already decided on the URL structure then navigate down to bottom part and click Save Changes.

The information above are all about Post and Pages, I hope you enjoyed reading it and the information given. 

Elementor Page Builder Plugin

Using the old school default text editor in WordPress is not that bad, but I think it’s about time for a live page builder. Elementor Page Builder is a live page builder with no limits of design. It delivers high-end design and advanced capabilities like drag and drop elements, all these features that don’t even exist in WordPress.

You can use elementor to any of the WordPress feature where WordPress editor is present. To make it simple, elementor is a replacement of WP default editor.

1. Go to Plugins > Add New > Search “Elementor Page Builder” or simply “Elementor” > Install Now > Activate

2. After activation, a new menu will be available named Elementor

It will redirect to a new page where you can create your first page. Click Create Your First Page then elementor editor will show up.

A list of drag and drag elements will be available for you including header, text editor, video, image, and so on. While other elements are in Pro version, you can’t use them unless you subscribe to pro version. But basically most of the free elements are what you need.

You can click Update or Publish to publish the page in live site. You can also Save as Draft or Save as Template too. 

3. Using elementor on Post. You can use elementor in creating your post, click Add New > Edit with Elementor

You can do the same thing I mentioned above, drag and drop fields or elements into your post.

You can click Update or Publish to publish the page in live site. You can also Save as Draft or Save as Template too.

4. Using elementor on Pages. You can use elementor in creating your post, click Add New > Edit with Elementor

Same process as Post, edit all you want then click Update, Publish, Save as Draft or Save as Template

Page Links To

If you want to hide ugly url’s and auto url’s that WordPress generates every time you create pages, post, or custom post type then you need to install this plugin. This plugin allows you to link to a URL of your choosing, instead of its WordPress URL. It also will redirect people who go to the your original URL to the new one you created using this plugin.

1. Go to Plugins > Add New > Search “Page Links ToInstall Now > Activate

There are options where you can manipulate your URL, via Add Page Link dialog and Page Links To meta box in action.

Add Page Link

To add page link, go to Pages > Add Page Link 

A dialog box will pop out, make sure that you already got the URL that you want your link to redirect to. Copy and Paste the URL to URL input box, give it a Title, and a short code. 

See the video beside for reference.

Page Links To

If you want to redirect a page to a post or vice versa or to any other URL or custom post type then you need to use the page links to option.

Go to your post or page, click Edit > go to the right side option and find Page Links To > A Custom URL > Input the URL where you want that page/post that you edited will redirect to. See the video beside for another sample related to page links to

Pods Plugin

1. Go to Plugins > Add New > Search “Pods” Install Now > Activate

2. After activation you will see new option named Pods Admin. Let’s create Movies with set of connections. So movies with multiple genre then keyword or taxonomies.

Go to Pods Admin > Add New > Create New > Fill in the necessary information > Next Step

You can Manage Fields or do Advance Options if necessary. Refer to the images beside you.

3. Let’s now create genre for our movie. Go to Pods Admin > Add New > Fill in the necessary information > Next Step

You can Manage Fields or do Advance Options if necessary. Refer to the video beside you.

Now that you finish creating Custom Post Types, we will now proceed with our taxonomy.

Okay, let’s do the taxonomy. Go to Pods Admin > Add New > Fill in the necessary information > Next Step, in the drop down Content type pick Custom Taxonomy.

Go to Advance Option Tab > Associated Post Types > Check Movies and or Genres if you want to see these taxonomies in both or in just one of those.

So we are done so far in terms of creating new content types. But we need to connect movies and genres too.

Edit Genre > Manage Fields > Add Field, make sure to put field type as Relationship and connect to Movies. See the video for further references.

So last part is to create Genres and Movies. Go to Movies option on the left side menu > Add New > Create. Same goes to genre, go to Genres > Add New > Create.

To see the exact instructions see the video beside for more information.

Elementor and Envato Templates

We already discuss the elementor editor in the previous tutorial, we build scratch template using its drag and drop feature and created blocks without template at all. But did you know that elementor has its own free and paid templates you can use? This template are design ready with colors, text, backgrounds, etc. You jus need to update the content, logo, and descriptions or even the colors. 

In this tutorial we will discuss how to load Elementor template and install a new extra Envato template that we can use in our Elementor page editor.

1. To start, we need to Add New page or post. Go to Pages > Add New

2. This will redirect to the WordPress editor, add the title for your page, then set default template to Elementor Full Width then Edit with Elementor.

3. In the elementor editor, instead of pressing the plus button which add new empty blocks, we will press the folder button. 

This will show a pop up list of elementor themes. There are different templates available, others are free while others are paid with Elementor Pro version.

In the templates given, you can see 3 diffent tabs:

  • Blocks – block of template that you can use. It is not a full template but just an area in your theme, eg. contact block etc
  • Pages – a whole page or series of blocks that will compose a complete page
  • My Templates – saved templates from previous used, created or downloaded templates.

4. Click Insert and it will download and add the template to your page.

So this is the end product of the template that we picked. This is actually a full page view with header and footer. Just like the previous tutorial about elementor, we discussed how to edit the blocks, text, images, etc using the drag and drop and clicking the element you want to adjust.

5. Click on the paragraph or header or title to edit. You can add new section by clicking the plus sign above each block, then drag and drop elements that you need or you can add new block template simply by clicking the + button then clicking the folder icon.

Elementor has a wide range of templates you can use and access. Even free ones are best, you just need to add some tweaks in order to achieve that design you want. 

Keep in mind that editing templates are exactly the same as creating new design like we discussed above, its just that we will just modify the content with ready theme.

So we done with adding template using Elementor, we will add a new plugin named Envato to add more templates that we can use in our page. 

1. Go to Plugins > search keyword Envato Elements > Install Now > Activate

2. Go to Pages > Add New > give a title to your page > edit with elementor

3. Click Envato Elements (green leafy icon). It will display a list of available templates sorted based on Installed (you already downloaded), Premium Kits, Free Kits, Free Blocks. These are actually the same definition as of Elementor Templates.

4. Let’s go to Free Kits tab, let’s pick Video Magazine template for our page style today. Click Install Kit, this will take a little time to download and install, after installation we will go to Installed Kits tab where we can see list of possible page styles we can use, the good thing about envato is it will give you multiple choice on what page your gonna use the template, either be in Home, Contact, etc. You also will noticed that some page style has ignore requirements issue, meaning you can’t use it because it’s only available in paid version of envato. We will pick the free one, click Insert Template.

This will be the output after installing your template. Click on the paragraph or header or title to edit. You can add new section by clicking the plus sign above each block, then drag and drop elements that you need or you can add new block template simply by clicking the + button then clicking the folder icon.

Just go thru all the area where you want to edit or improve the text or design of your template. 

5. Click Update when you’re done or you can save this as template for your next page site.

Saving and Loading Template

1. After clicking Update button, you can save your template for future use – click on the arrow up button beside Update button. Click on the Save As Template. The image beside will pop up asking for the template’s name > click Save. You will see this saved templates under My Templates.

2. To load the template, click + sign to add new Section > click on the folder icon > My Templates tab > Insert.

As simple as that, you can now use the template on your page.

Make Column Clickable Elementor Plugin

Allow users to click in the whole column instead of individual elements. Users will be able to click in the whole column when you add a link on that. We will discuss how to use it and what functionality it has.

1. Go to Plugins > Add New > search for keyword “Make Column Clickable Elementor” > Install Now > Activate

2. Go to Pages > Add New > Edit with Elementor

3. You can also edit or create new page if you want, but my example was based on already created elementor page.

4. For example purposes, add new section. This plugin doesn’t work in sections but inside the section which is the column. Column is the dotted gray line inside black dotted section. Click on the icon (in red box of the first image box), and it will show the Column Link area where you can input the URL.

5. In the second image above, I added a URL and also added a Text Header on that column. And whatever you put inside this column, it will surely redirect to that custom link inputted.

6. Let’s go to the page we updated, as you can see I hover on the “Adapt Site” header that I created and the link below shows. This will then redirect to the adaptsites basing on the URL.

Web Stories

1.Go to web stories website and download their beta plugin.

2. Login to your WordPress site, go to Plugins > Add New > Upload Plugin > Upload File

3. Install Now and Activate the plugin.

4. After activation, a new Stories menu will show. Click on dashboard and you will see the existing templates, stories created, or create new story.

5. Choose a template, click Use Template and you will be redirected to a story editor page. This is just like elementor or photoshop (layering). 

6. This is the editor, you can see on the left side tab – image (upload), text, and shapes – you can insert or add this to your story page.

7. On the right side menu, you can see Layers and Design area. In layer you can see series of images, text, etc in one story page. While the Design area is the section where you can edit the content or settings of a layer.

8. The center is the series of page story. The dash corresponds the number of pages in your story (click it to navigate to next page). Under the page you can delete, duplicate, add, and rotate a page. While the right side is the view style.

9. After all the necessary edit, you can Save Draft, Preview, or Publish.

Just explore all the possible changes you want to do for your story page. Upload images, edit text style (a lot of font style is available free for you to use)

10. Once you click Publish, an image above will pop up. You can view story, dismiss, and or add to new post.

11. Try to click Add New Post, this will redirect to post page. An HTML code will show on your post, click Preview to see the changes or Publish your post.

12. Go back to your Stories Dashboard. You can see the newly created story. You can also edit, rename, duplicate or delete story.

13. Above is the example preview of the story we create. You can maneuver it via the left and right arrows or let it play via the play and pause button above. You can also share it via the share button.

14. Let’s try to create new web story without using the templates. Click Create New Story button.

15. An empty page will show, pick any image you want and drag it over to your page. Set that image as your background.

16. Add text, logo, shapes to your page. You can do whatever you want and show your artistic side. You can also drag and drop – rearrange the layers if you want. Add a new page by clicking + button below.

17. This is the preview of the newly created one page story. Go ahead and publish yours.

18. Go back to your story dashboard and you will see the newly created story. As you see we created two stories. One from template the other one from scratch.