For many people who are looking to add in specific features to the homepage they are limited as they are mostly hacky theme edits which have to be redone on each theme update. My goal over the next week is to build in replacements for the pages which will allow you to use Elementor with Acabado to make tweaks in the way the homepage presents information.
This will be a series though where I will be rebuilding the pages and providing the templates to allow anyone to download and install them. Of note the homepage requires Elementor Pro due to the posts widget not being available in the free version.
If you are interested in using this template please help me out by clicking on this link when you purchase Elementor Pro as it is my affiliate link and helps me out with this time I spend not working on my own niche sites.
For those who already own Elementor Pro please download the template(s) here and install, set this page as your static homepage in the reading settings and you will be ready to customize it right away.
The template is built with a lean towards the traditional Acabado homepage and was built because there was a want and need from the community to be able to replace the homepage with a more functional homepage.
The template uses the standard Acabado header and footer so it is only a main content replace of the homepage, this made it easier to let anyone load it and start making changes immediately.
Please note that you now load the ability to change things from the [ Acabado Homepage ] area in the Acabado Settings. This is because that will only update that original homepage which you can always switch to by putting the homepage back to the [ home ] slug page.
You will need to create a page in your website and name it [ Elementor Home ] for example, though you can name it anything but [ home ] as you want the slug to be different. Once created you will want to [ Edit with Elementor ].
You will want to click on the folder icon in the middle of the edit page which is templates.
Then you will want to click on the upward arrow in the top right for upload a template (from the download above)
Then you will want to select the file you downloaded from above. Once you complete the import you will see it in the list similar to below:
You will want to click that [ Insert ] button to add it to the page.
Click [ Yes ] to the import warning as it will overwrite everything on the page.
You are now ready to proceed to the below to understand the elements built in the template.
Well what looks like a page when rendered to the website visitors is really multiple elements all mixed together and ordered so they present a set of aligned content for the user.
I broke this up into 4 primary sections to mimic the standard Acabado theme homepage: The hero section, the featured tiles section, the recent posts section, and the sidebar section. In addition since this is an Elementor page you can always re-organize these elements or add new ones.
With the hero section in Elementor you will need to edit the page to make your changes but this allows much more flexibility as your image no longer is stuck being 1200×400. Elementor allows for much more customization while maintaining the original look and feel.
As you can see from the Image you have a heading for your call to action button which are both fully able to be edited to your needs on your website. If you don’t want it on your site you can just as easily delete the added section and go without!
This was more a element I set in place to allow you to add should you choose as most of the Acabado sites I see don’t utilize this often, if it would help to have a template with each mix pre-filled in with demo content please just comment below and I will work to fix this and upload additional templates.
I didn’t build it out as the space will stay empty if they aren’t filled in and was more a placeholder should someone choose they wanted to add in a featured tile array, Elementor can do up to 5 columns so this is something which will depend on each unique site need.
These share a split column element on the template as this is what allows for a 70/30 split of space in the same row, then for the recent posts section Elementor (Free) doesn’t have the posts element which had me stuck until I added Elementor Pro.
Yes I do know there is a large and vast array of “free” plugins which may have posts options in them but I use only the best supported plugins to maintain site security and if you intend for this to be a business then the investment in Elementor Pro is a very justified expense.
As you can see the build was intentional to maintain the exact look and feel of Acabado but to allow for some freedom in modifying, shifting, and adding more content into the layout.
For Example If you wanted to add on a contact form you could do it just below the hero, in the featured tiles or below them, after the posts or into the sidebar with ease.
This flexibility will help you to have a better control on your homepage while giving you the things people have wanted to add.
As with all Elementor pages you are free to add onto the page and make it as long as you want, I would think if you were to run WooCommerce on your Acabado site (see this post for how) you could show most popular products sold.
If you aren’t running a store it could be a place for you to put an email subscription call to action, or a Instagram feed, or maybe a YouTube welcome video.
Anytime you run a pagebuilder like Elementor you will get speed hits, since that is a core selling point to Acabado this could be a negative for you depending on your overall belief that PageSpeed scores actually impact your rankings, though this has been shown to be false in almost all testing done by SEOs.
If you are in Project 24 and are signed up with Ezoic at our low barrier of entry at the 1k-2k pageviews then you have access to the Site Speed Accelerator. For members of Project 24 this tool is FREE, if not signed up click here to join as the cost for the course is a huge savings versus $30 a month.
This would allow the site speed accelerator to help manage the caching and would get your pagespeed into the 80-90s range while giving you the flexibility on the front end.
If not a member and not interested in the freebies and benefits then you can go with my primary favorite caching plugin WP Rocket. I like WP Rocket as it is simple to setup and they respond to support questions and issues very fast.
This was a concept and a thought that I will probably turn into a video to help people understand how the page works and how they can change or manage the elements.
I would love to hear in the comments what you think about this and if it could be helpful to you and if there was parts you would like to see specifically.
The next page I will be rebuilding is the static (blog) page from the same reading area in the settings. After this I plan to build out an About Me template which helps everyone fill in the about needs for their site.
After this I will move into a resources page or maybe a landing page, I would love to hear in the comments what people are most interested in!
Acabado has a Hero Image which works well for a desktop view but it is cropped and unusable in mobile view for most, this method allows you to replace the image
When you want to build landing pages people talk about how you need page builders, the thing is though that Gutenberg by itself may be more than good.
You can't go wrong starting to learn page builders with Elementor Free, it can help you understand what the builder experience is like!
