Freeola Home Get Dotted Domains Win Free Games Freeola Blog Freeola Guides Freeola Customer Forum
get Any UK domain name
just 49p for 1 year!

Freeola Guides


Adding Custom Body Code

By Freeola Support on 11th December, 2017 | 0 Comment(s)

Any custom body code you apply using the method described in this tutorial, will apply to all pages of your site.

 

Adding Custom Body Code

 

For this tutorial, we will be adding the custom footer image below to all the pages on our site.

 

Custom Footer

 

To follow this tutorial and add your own footer, you will need to first upload the image that you want to your Media Library.

 

To do this, from the Main Menu select Upload Media from under the Images & Media heading, you can either Drag & Drop the image in, or press Browse Computer for Files and select from your files. Once your image has uploaded, press Next Step, this will take you to your Media Library.

 

The content area of all InstantPro sites is 702 pixels wide - so if you want it to fit perfectly; press the Pencil Icon and this will take you to the Image Editor, where you can resize your image.

 

Step 1: From the Main Menu, select Your Media Library under the Images & Media header.

 

Select Media Library

 

Step 2: Find the footer image you have uploaded, click to see the full size image, then Right Click and select Copy Image Address (Image Location on Macs).

 

Copy Image URL

 

Step 3: Now you have your Image Address, head back to the Main Menu and select Custom Code & Snippets from under the Website Tools heading.

 

Custom Code & Snippets

 

Step 4: Select the Custom < body > Code tab to the right, now you will have to enter some custom code, as can be seen in the image below (click to magnify).

 

Custom <body> Code

 

When writing your own custom HTML code, it must be written between a set of < html > and < / html > tags.

 

We've chosen to align the image centrally using < div align="center" > which must be closed by using < / div >

 

We included the image by using a simple < img src="image address" > tag.

 

Step 5: Paste the Image Address that you copied earlier inside the "" marks of the < image src >tag.

 

Code With Image URL

 

Once you are happy with your code, click Save and then Finish.

 

Step 6: To check the footer is displaying correctly, click the View Website button in the InstantPro header.

 

Preview Website

Did you find this article helpful?

Yes | No


Article Comments (0)
There are currently no comments on this article.
Add your comment:

Comments are limited to 750 characters, you have 750 remaining.

Freeola & GetDotted are rated

Check out some of our customer testimonials below:

First Class!
I feel that your service on this occasion was absolutely first class - a model of excellence. After this, I hope to stay with Freeola for a long time!

View More Testimonials

Wonderful...
... and so easy-to-use even for a technophobe like me. I had my website up in a couple of hours. Thank you.
Vivien

View More Testimonials

Need some help? Give us a call on 01376 55 60 60

Go to Support Centre
Tell us what you think!

Live Chat is offline

Live Chat is available:
9am to 6:30pm Monday to Friday (excluding bank holidays).

01376 55 60 60

Send us a ticket.

It appears you are using an old browser, as such, some parts of the Freeola and Getdotted site will not work as intended. Using the latest version of your browser, or another browser such as Google Chrome, Mozilla Firefox, or Opera will provide a better, safer browsing experience for you.