Throughout the tutorial here there are a few steps that might not be needed if you haven’t either set up a blog template first within Elementor OR you are not interested in doing any kind of SEO work for your pages/site. If neither of these are the case, skip to step 5. This is my exact recorded process so it might not be needed for you.
Step 1. Create a New Page
Create a new (blank) page from within the WordPress dashboard
Navigate to Pages > Add New and name your post.
Step 2. Add In Post Excerpt
Before moving on to the Elementor side of things, there are few settings on this screen (WordPress new page) that need to be changed.
The screenshot to the right here (if you’re on desktop) is what’s called the post excerpt. It’s found along the right hand column of this WordPress page screen (you will most likely have to scroll down a bit in the right sidebar to find it).
If you’ve followed along with the previous tutorial we had gone through and added the ‘post excerpt’ element to the design header.
Spacing Your Excerpt
If your excerpt is a bit too long (remember I recommended no more than one short paragraph), here’s a trick to add in a bit of space.
The problem is that spaces and line breaks do not work in the excerpt area, couldn’t tell you why this is the case but I just know it doesn’t work.
SO what you can do to add in a space (if really needed), write in the highlighted characters in yellow. It’s < br > but without the spaces between, this is essentially html that forces a line break.
I have two groups of them in my example in order to get a single line space between, otherwise the text just goes down one line.
Step 3. Assign Category
If you have different blog post categories you’ll need to choose the proper one that your new post will reside in. This is mainly necessarily if you DO have more than one blog post category and design templates assigned to each.
By default, most likely the category will be set to ‘uncategorized’ if you do change this setting.
Step 4. SEO Prep (advanced)
This is by no means a full tutorial on SEO (search engine optimization) but I wanted to include it so that when you get there, maybe it will be beneficial.
For SEO (WordPress side of things) I use the plugin Yoast SEO. This allows me to change both the page title and meta description (shown in the screenshot here).
The page title is what renders in Google search results and the browser tab (pretty much anytime the page is publicly previewed. The meta description is that short 1-2 sentence description that you see inside Google search result pages.
All of this is helpful for click-through-rates and can be measured/quantified later.
Step 5. Save WordPress Page Draft
Now that you’ve changed some of the settings, categories and other info on this newly created page, it’s time to move on to the Elementor side of things!
Big thing first, make sure to click ‘save draft’ in the top right corner of this page before moving on.
After you’ve clicked ‘save draft’ you can click into the Elementor side (that blue button either on the top left or top middle of this page).
Step 6. Start Adding Page Elements
Assuming you’re using a page template that you made from the Elementor Theme Builder, full tutorial here in case you missed it:
After clicking into the Elementor page, you should see your previous design elements (made in your template). Here’s a quick overview of what’s inside my exact design template (made from scratch):
Step 7. Troubleshooting Page Layout
If you don’t see your previously made template, 9/10 times it’s because the post setting layout is not set properly.
To check what your settings currently are, navigate to the gear icon at the very bottom left of the page (when inside the actual Elementor page). Near the bottom of the individual post settings there will be a setting called “page layout.”
Click on this dropdown and set it to either default (assuming you’re using an Elementor build) or try full-width layout. These two options inherit all the global elementor settings to the page or post.
Step 8. Start Adding Page Elements
Just like you would start adding elements to a blank Elementor canvas page, click the plus button at the bottom two add new sections (or containers, depending on your setup). For this main content section I usually rotate between 1 and 2 column layouts.
The two columns are for when I want an image right next to a column of text.
Step 9. Finish Element Layout
Add in all the elements as needed. I typically alternate between a headline, text box and maybe an image (nothing fancy here).
Step 10. Publish Finished Page
Once you’ve got the page to where you want all the elements and images, it’s time to publish the page. Typically what I do before hitting publish is click the preview icon (it’s the little eye icon to the left of the publish button).
This gives me the exact layout of what the page will look like when rendered. If any changes need to be made I can change them first (you can always change after publishing too).
Step 11. Adding Your Page To Google (advanced)
Likely you won’t be doing this step but I’m including it in this tutorial for full transparency (insight into my own process).
Once the page is published, the internet doesn’t necessarily know it’s there. I like to tell Google that my new page exists by submitting it to them directly. For this you will need Google Search Console (advanced setup required).
If you have GSC already set up properly then you should paste your URL into the top search bar and press enter.
Step 12. Google Search Console (Advanced)
After pasting your new URL into the top search bar of GSC and hitting enter a new screen will appear (screenshot below). I’ve highlighted in green the button that needs to be pressed, ‘request indexing.’
Click this button and validation will begin.
Step 13. Google Search Console Part 2 (Advanced)
Upon clicking the ‘request indexing’ button a popup will appear that says ‘indexing in progress.’ Let this load and then a confirmation will appear within the popup (shown below). And that’s it! That’s my full overview on how to add a new blog post to WordPress, using Elementor.