How to Edit your Refari Website's Footer

Created by Mervin WebDev, Modified on Mon, 22 Apr at 8:10 PM by Aaron Refari

A website footer may seem like a small detail, but it plays a crucial role in enhancing user experience, providing essential information, and maintaining legal compliance. It serves as a navigational aid, offering links to important pages and sections, ensuring visitors can easily explore the site.

Additionally, footers often contain contact information, allowing users to reach out with questions or inquiries. Legal information, such as copyright notices and privacy policies, helps protect the website owner and informs visitors about their rights. By including social media links, footers facilitate further engagement and interaction with the website's community. In essence, the footer acts as a silent yet indispensable guide, ensuring visitors have a seamless and informative browsing experience.

Today, we'll show you on how you can easily update and edit contents on your Refari built website.

You need to login to your Refari Site first before you can make changes or updates. To login follow this article: click here

Follow the steps below on how you can edit your website's footer:

1. On your site's dashboard, navigate in the side panel and hover on "Templates" and click "Saved Templates"

2. Within the "Saved Templates" click "All" to show all templates lists

3. Find the "Footer" template and click "Edit with Elementor" to open editor view of the footer

4. Or another way to open the editor view of the footer is on your site's front-end, hover on the top left of the wordpress top bar and click "Visit Site" to go to the front-end

5. Now within the page/front-end of the site, navigate in the wordpress top bar and hover on "Edit with Elementor" and click "Footer"

6. Now within the editor page, you can easily edit contents in your site's footer. Example we'll edit the footer's description, simply click the text widget

7. In the side panel, the Text widget properties will appear. To edit the contents just navigate in the side panel and click "Text" tab

Note: do not edit contents in the Visual tab of the text widget as it will create unnecessary html tags and will create empty spaces, if you want to break into two paragraphs, use: <br> and insert between the paragraphs.

8. Within the text tab, simply input or paste the contents you want to replace or update.

9. Next, if you want to update the headings in the footer, simply click the heading widgets.

10. In the side panel, heading widget properties will appear. Simply update the content in the field.

11. Just repeat the process for other headings.

12. Next, let's edit or add links in the footer. Click the icon list widget.

13. In the side panel, click any of the items in the list to edit.

14. Now input the title of the page you want to display in the list in the text field

15. Then in the link field, input the link of the page you want to add

16. Now repeat the process to update other links in the lists

17. To duplicate an item, simply click the "duplicate" icon. This allows you to add more items in the list faster rather than "add item".

18. The item list will be duplicated and you can simply edit or update it's content, just repeat the process on how to edit.

19. Now let's try to add an item in the list, click the "add item" to add an item in the list

20. Now an item is added, since other item list doesn't have an icon let's remove the icon to make the list consistent. Click the "trash" icon to remove the icon. In some scenario where you want an icon to an item list just click the icon library and browse for icons or click upload SVG for a custom icon.

21. Now with the new item added in the list, just repeat the process previously to edit the Text and Link of the item.

22. If you want to change the font family, colors, size of the items, click on the "Style" tab

23. In the List properties, this is where you can change the spacing between items and alignments.

24. In the Text properties, this is where you can change the font family, size and colors of the items.

25. Click the "pencil" icon under the Typography to change fonts, and sizes.

26. To change the font color in normal and hover mode, simply click the tabs "Normal" or "Hover"

27. Then click the "Colour" icon to open the color wheel

28. Simply input the color you want in the color wheel hexcode field or drag around the colour picker.

29. Now let's try to edit the contact information in your site's footer, like the company location, emails, telephone numbers. Click the Item list widget. (We use the same widget for the links and contact info)

30. Just repeat the process previously on editing the item list widget contents by clicking the items in the list and input the text and links you want in the fields.

31. For the email, input the email on the text field and in the link field input this format to add an email link "mailto:company@email.com"

32. For the phone number, input the phone number the text field and in the link field input this format to add an phone link "tel:+123456789"

33. Now let's edit the social icons. Click the social icons in the footer to open it's properties.

34. To add another social icons, click the "add item".

35. Once a new social icon is added in the list, click the Icon Library to browse for icons, or Upload SVG to use your custom icon.

36. In the icon library, just click the icon you want to use and press "Insert" button.

37. Once done with the changes in the footer, click the "Publish" button to save changes and simply reloat your site.

So that's all for this tutorial. If you have more questions or doesn't find what you are looking for, send us an email so we can help.