Robyns user guide
NL TItans Admin Guide
Making any changes or edits, I would always use the admin panel. Provided below are screenshots to help you understand this guide. The first screenshot is of your basic WP admin screen, and is on the pages section of the website. Any pages with the word “elementor” beside it are designed to match your theme. If you hover your mouse over the page name, some options will appear below the page name, always select “Edit with elementor”
We will now look at the elementor screen you should next see after selecting edit with elementor. It does take a few seconds to load, but it will load and look something like the image below. your control panel is on the left to add elements or adjust settings.
Lets take a wee moment to understand some of the icons and such. Top left, the 3 lines hamburger menu is the main elementor menu (and how to return back to your WordPress admin page) the other side of it, the grid will open up the menu of elements you can drag onto the page to configure, such as in this example.
In the bottom left of the screen, you will see a settings cog, a layers toggle (the list of the page layout inside the navigator box on the right) as the page is effectively built in horizontal sections, stacked on top of each other. When you select a section, a blue box will appear around that entire section.
About the blue section: The + icon, lets you insert a new section above the current one. The dots let you drag the section up and down the page to re-order it, and finally the X will delete the entire section.
The revision clock is exactly that, and will let you roll back to any stage in that current editing session, so if you change something and it doesn’t work or look right, you can simply roll back the edit.
Please Note: If you exit the page (save and close it) you will not be able to go back to previous edits. So you can edit, save and preview, and as long as the edit page is still open, you can perform a rollback.
The next icon, is for multi-device view, so you can see how any page may look on mobile or tablet, and finally the last icon (eye) is so that you can preview your changes. Publish will save the changes.
When you click on any element on the screen, you will see the navigator open up on the right (or you can click the layers icon to open/close it), and go to that elements section. On the left is where you would make any changes to the contents of that element. The style tab will allow you to change font colours, sizes etc. The advanced tab allows you to do some extra things like space around the text, or animations etc.
About the blue section: Clicking on the + icon will make a large grey box like this appear with several options. As stated, you can simply drag a widget from the left side, into this box, or, you can click on the grey folder icon to get the following library screen.
From here, it will start on the pages tab which you could use, but the tab called My Templates, is where all the elements for this theme are. Some of these are pages, some are just sections, but feel free to play around.
Even though it is a WYSIWYG editor, when changing text you will click on the part on the page, highlighting that whole section in blue, but you edit the text or settings in the area on the left.
Animated hover images on homepage
When you select the image, the border around it should be blue, then use the panel on the left. In the Advanced Tab, select the background option from the Hamburger menu, and click on the image here, to edit or replace it.
additional homepage images
As above when you select the image, the border around it should be blue, then use the Navigator panel on the right. The JKit – Icon box should be the active label. Just above that select the Column label.
Back to our menu on the left, In the Style Tab, select the desired image on this panel. Make sure to pay attention to the position and repeat options once you have selected your image.
exiting elementor correctly
The following two screens are related, and will show you how to exit elementor correctly. First, in the top left of the page, click on the three horizontal lines to open the menu, and select, “exit to dashboard” (the publish/update button should be grey, but the system will warn you if you try to leave before saving any work)
Once you have exited the elementor editor, you will be taken back to the WordPress editor, you should not click or make any changes here, and only click on the large black WordPress logo in the top left of the page, this will return you to the pages list. (A recent update to the elementor plugin should allow you to now choose a default location to exit to when completing this process)
Making a new page
This a two step process. From the admin panel, when you select add page, the following screen will open, with two pieces of editable text on the screen.
- Type the heading as the name of your page, then type just anything, one word into the next line, then click save draft.
- Once saved, you can now select the blue button, “edit with elementor”
This next step is very important. Once you click the edit with elementor button a new page would look like the image below, and we have to adjust a few settings.
Clicking on the cog on bottom left, you will see the following panel, and in the drop down option for Page Layout, you must select “Elementor canvas full width“
This will make the header and footer of your theme populate onto your blank page, and you can start adding new sections or elements as you see fit.
backup the website before any major changes
This step is very important. Your best option is to use SiteGrounds powerful site tools feature. Although they should do a website backup every 24hrs for you, if you do forget.
Once logged into you SiteGround account, select your website domain name, and then Site Tools.
On the left hand menu, under Security you will find Back-Ups. You can create a manual back-up, or choose from one of the available back-ups on file to roll your website back to. To do this, click on the stacked dots on the right hand side of the screen.
Every single thing will go back to how it was on that date/time.
