1. Navigate to Dashboard → Appearance → CuckooLove in your WordPress dashboard panel.
2. Click on Homepage Builder button.
3. Or click on Homepage Builder from CuckooLove theme dropdown menu.
Using CuckooLove WordPress Theme Homepage Builder you can build custom homepage layout. Add homepage units to your homepage and arrange the sequence as you wish. It is easy as 1-2-3.
Available Homepage Units
- 3 Columns Unit
- Blog Posts Unit
- Guestbook (Testimonials)
- Guests (Team members)
- HTML Text Unit
- Map Unit
- Page Unit
- Photos Gallery (Works Portfolio)
- Shortcode Unit
- Social Media Unit
- Text Box Unit
- Woo Navigation Bar
- WooCommerce Unit
Homepage Structure
CuckooLove Homepage Layout consists of fixed elements and floating elements. Fixed elements are arranged in fixed positions and cannot be rearranged, whereas floating elements can be arranged as you wish and added as many as you wish.
Fixed Elements
Main Slideshow Player at the top of the page with customizable header, Contact unit containing your contact details, Homepage Super Footer and Main Footer at the bottom of the page. Settings of these elements can be edited via theme framework. In addition, if you don’t wanna use fixed Contact Unit, you can build it as page using theme shortcodes and add it anywhere on the homepage using Page Unit.
Floating Elements
All other elements that can be added via Homepage Builder are floating. Theme users can change the location of these elements in homepage layout and fully customize their appearance: add custom background or parallax background, change fonts and other details.
3 Columns Unit can be used for displaying Guests (Team Members), Guestbook entries (Testimonials) and Events. Middle column can be used for displaying Photo Slideshows (created using Work post) or Revolution and Layer Sliders that can be added using shortcode.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select 3 Columns as unit source;
3. Enter Unit Subtitle if needed;
4. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
5. Choose Left Column content source. For example Guests (Team Members). If you’ll select Guestbook (Testimonials), Guestbook entries will be displayed.
6. Select Guest to display;
7. Choose middle column content. For example Photos.
8. Photos Slider dropdown displays all Photos (Works) posts. Select post that contains images added using internal Photo (Work) post gallery. If internal gallery contains more than 1 image, slideshow will be displayed. If you’ll choose Shortcode as middle column content source, Revolution and Layer Slider shortcode form field will appear.
9. Choose Right Column content source. For example Events;
10. Select Event to display;
11. Disable or enable left and right columns content links;
12. Choose one of three available button styles;
13. Enter social media shortcode. It will be displayed below title and subtitle of this unit;
14. Select Photos slider transition effect;
15. Set unit background properties.
Using Homepage Builder Blog Posts Unit you can display Featured Posts from your blog. Choose one of three available Homepage Blog Posts Unit layouts and set display options: number of posts, category, posts sorting etc.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Blog Posts as unit source;
3. Enter Unit Subtitle if needed;
4. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
5. Choose Blog Posts Unit Content;
6. Exclude posts categories;
7. Enter number of posts to display;
8. Show or hide post details;
9. Choose posts sorting;
10. Choose one of three available button styles;
11. Choose one of three Blog post unit display options;
12. Enable or disable Carousel Effect;
13. Choose Animation Effect;
14. Set unit background properties.
Using Guestbook (Testimonials) Unit you can display kind words of your customers or clients. Unit displays content created using Testimonials Custom Post #3.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Guestbook (Testimonials) as unit source;
3. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
4. Choose Unit Display Option;
5. Enter number of items to display;
6. Choose animation effect;
7. Choose sorting;
8. Choose one of three available button styles;
9. Set unit background properties.
Using Guests Unit (Team Unit) you can introduce your Guests (Team Members). Unit displays content created using Team Custom Post #2.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Guests (Team) as unit source;
3. Enter Unit Subtitle if needed;
4. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
5. Choose Unit Content;
6. Exclude types or categories;
7. Enter number of items to display;
8. Choose Sorting;
9. Enable or disable Carousel Effect;
10. Disable or enable content links;
11. Choose Animation Effect;
12. Choose one of three available button styles;
13. Set unit background properties.
Using HTML Text unit you can enter Arbitrary text or HTML.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select HTML Text as unit source;
3. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
4. Edit Top and Bottom padding of unit if needed;
5. Enter Arbitrary text or HTML;
6. Set unit background properties.
Using Map unit you can display full width map in your site’s homepage by entering address only. If you want to add an advanced map created using Cuckoo Map Shortcode, please select Shortcode as unit source and paste your shortcode.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Map as unit source;
3. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
4. Enter Map address;
5. Edit Map Zoom;
6. Enter Map unit height.
This great feature allows you to display almost anything you need in your homepage. Add videos, images or any other content that can be published in WordPress pages. Select your page from pages dropdown and page will be displayed via Page Unit in your homepage.
Important! Page Unit displays only pages created using Default Template.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Page as unit source;
3. Enter Unit Subtitle if needed;
4. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
5. Select Page from pages dropdown;
6. Edit top and bottom padding of the unit if needed;
7. Set unit background properties.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Using Photos Gallery Unit (Works Unit) you can display your featured photos or works in the homepage. Add unlimited number of units and set a any type for each unit to display. Unit displays content created using Works Custom Post #1.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Photos Gallery (Works Gallery) as unit source;
3. Enter Unit Subtitle if needed;
4. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
5. Choose Unit Content;
6. Exclude types or categories;
7. Enable or disable Lightbox;
8. Enter number of items to display;
9. Choose Sorting;
10. Display filter;
11. Choose default unit content;
12. Choose one of three available button styles;
13. Set unit background properties.
Shortcode Unit allows using following shortcodes: Countdown shortcode, Map Shortcodes, Video Shortcode, Revolution Slider shortcode, Layer Slider shortcode.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Shortcode as unit source;
3. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
4. Enter Shortcode;
5. Edit top and bottom padding of the unit if needed;
6. Set unit background properties.
Social Media Unit displays links to your social media profiles that the user enters using CuckooLove → Social Media Tab of this framework.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Social Media as unit source;
3. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
4. Choose which Social Media icons to display;
5. Set unit background properties.
Using Text Box Unit you can display company slogans or any other text content. Button is optional.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Text Box as unit source;
3. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
4. Enter Your text;
5. Enter title and URL for your button if needed;
6. Choose one of three available button styles;
7. Set unit background properties.
Woo Navigation Bar unit allows to display main WooCommerce links and cart information in homepage.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select Woo Navigation Bar as unit source;
3. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
4. Set custom unit font size if needed;
5. Set unit background properties.
Using WooCommerce Unit you can display your featured products or categories in homepage. Add as many units as you need, choose different categories of products for each unit.
To change Unit position drag unit up or down by using Drag button. If you want you can add a Custom Background Image or set Custom Color for this unit. To delete unit click Delete button and then click Save button.
Click Add Unit button and a new unit below all units will appear.
1. Enter Unit title;
2. Select WooCommerce as unit source;
3. Enter Unit Subtitle if needed;
4. Editable Unit Slug will be generated automatically. It will be used for linking with navigation menus;
5. Choose unit display options;
6. Choose one of three available button styles;
7. Choose unit content;
8. Choose product category;
9. Enable or disable Woo Navigation bar;
10. Enter number of items to display;
11. Choose Sorting;
12. Choose Display order;
13. Set unit background properties.
