Introduction

In this tutorial, I'm going to modify all the home-page elements based on JKit items. Some elements, that are not based on JKit, need a different approach, so we will see them later in detail. These items are the top toolbar, the main navigation and the availability search form.

Step 1: Welcome text

You only need to edit the HOME - WELCOME item, like all the other elements in our themes, it has a very simple HTML code. You can use the toggle button of the text editor to see the HTML code. If you did not installed JCE Editor, please do it, it's explained in this tutorial.

Step 2: Featured stories

This element is controlled by the HOME - FEATURED item. The item itself controls the top-text and the section background image. The item's image gallery control the different elements.

Every image has a link associated to it, we recommend to add a fixed URL, relative to your site base URL, other developers prefer to use Joomla system links to prevent broken links, but in our opinion broken links are as bad as deleted/moved URLs. 

Generally, our themes allow you to choose between a 3 image or 4 image layout, so it can be adapted to your needs.

Step 3: Customer reviews, collage, benefits, contact & footer

These sections are controlled in a similar way than the previous. You only need to edit the main item and it's image galleries. Be careful with HTML codes, always trying to maintain the tags structure for better results.

The JKit items you need to edit are titled HOME - COLLAGE, HOME - REVIEWS, BOTTOM - BENEFITS, BOTTOM - CONTACT. As you may have noticed, the Benefits and Contact sections are displayed not only in the homepage but also in the inner sections, at the bottom of the page, as we will see it in more detail later.

Next steps

In the following tutorial, we are going to modify the navigation and start customizing the inner pages.