Luviana Theme Documentation

Luviana Theme Documentation 
Updated on March 16, 2021 
 
Quick Start Guide 
Installation 
Import sample data 
Insert API keys (optional) 
Add rental units and optionally enable bookings 
Set up the front page 
Customize the front page 
WordPress Customizer settings 
Site identity 
Colors 
Header image 
Background image 
Menus 
Theme Options 
Footer options 
Header options 
Blog options 
Site options 
Front page slider 
 
Quick Start Guide 
1. Install and activate the Luviana WordPress theme. 
2. Install and activate required plugins. You may optionally disable unneeded plugins later. 
3. Import sample data (if you install a theme on a fresh website). 
4. Feature accommodations and enable booking services (work with MotoPress Hotel 
Booking plugin). 
5. Set up and customize the front page. 
6. Edit website identity, menus and header in the WordPress Customizer. 

7. Customize other website pages.

Installation

1. In your WordPress admin panel, go to Appearance → Themes and click the Add New

button.

2. Click Upload Theme, Browse and Choose File; then select the theme's ZIP file. Click

Install Now.

3. Click Activate to use your new theme.

4. Immediately after the activation, you’ll be prompted to install a number of different

plugins that ensures that your website looks and functions as the default Luviana demo -

you can install all of them at this stage



and later deactivate / uninstall plugins you won’t

need. You simply need to click the “Begin installing plugins” link.

5. Once all plugins are installed and activated, you may want to import sample data to the

theme to edit all pages easier.

Warning! Import sample data only in case it’s a fresh website and it doesn’t contain any custom

content!

Import sample data

When all required plugins are installed and activated, Import Demo Data menu should appear

under the Appearance menu on your WordPress dashboard.



Head over to this menu and run

the importer by clicking on the “Import Demo Data” button.

Once the process is finished, you can start customizing your theme!

Insert API keys (optional)

You don’t really need extra plugins that work through API integration - Getwid plugin for building

content with Gutenberg can be used instead. If you plan to use any content modules by the

Getwid blocks plugin for Gutenberg that require API integration (e.g. Google Maps, Instagram

Gallery, Captcha, etc.), you can obtain and insert your API keys anytime via Settings →

Writing Settings → Getwid.

There are 2 ways you can proceed with the theme customization:

1. General website settings and design customization.

2. Add rental properties with MotoPress Hotel booking plugin and configure the needed

settings for the booking system.

We recommend starting with a way 2. This will help you firstly add properties related content

and only after that customize theme appearance (as well as appearance of the rest of the

theme).

Add rental units and optionally enable bookings

We developed our custom hotel room/property booking plugin (MotoPress Hotel Booking plugin)

and integrated it with the Luviana WordPress theme. When installing the theme, you’ll be

offered to install and activate the Hotel Booking plugin.

The plugin fulfills several functions: with its help, you will present all accommodations, services,

details of each accommodation as well as turn on online reservation of the properties.

With Luviana, you can rent out multiple rentals as single items or a complex condo bookable by

a room/apartment.

Note! This is just a quick guide of how to create accommodations listing with booking service

enabled. When you need a step-by-step guide, check out the detailed



Hotel Booking plugin

documentation



1. If the MotoPress Hotel Booking plugin is activated, two menus should appear:

Accommodation and Bookings



. You'll need to add apartments available in your property / all

properties via Accommodation → Accommodation types → Add New. By default, the property

reservation option is enabled (Accommodation → Settings → Disable Booking). If you imported

demo data, you should see sample accommodation types which you can customize.

To make it even easier, firstly add the list of available categorized items: Amenities



, all Services

available (paid or free, e.g. parking, luggage storage, spa service), and Bed types



(under

Settings → Bed types). Once these are added, you can head over to adding/customizing

accommodation types.

The difference between Accommodations and Accommodation Types is the following:

accommodations are physical bookable apartments, while Accommodation Types are just the

catchall term for the same accommodations. For example, you may have 3 physical bookable

Accommodations



under a “Standard double room” Accommodation Type



. The number of real

rooms is added from the same Accommodation Types screen.

If you rent out multiple vacation rentals as single items, add them all as different

Accommodation Types (e.g. villa #1, villa #2).

If you rent out only one rental unit as a single item, add it as one Accommodation Type and set

the “number of accommodations” to 1.

3. Add Rates to present the same rental units with different conditions:

● Pricing based on specific dates – “Seasons”.

● Any price for any custom length of stay: feel free to set short and long-term boarding

rates.

● Any rate based on the specific conditions: extra amenities, including food or services.

The plugin also allows for setting different prices depending on the number of guests



, but only

when you use “adults” and “children” values (they are directly connected with the pricing

system).

Guests will be able to choose rates when booking a property. From the same screen, you can

add variable pricing if you need different pricing options depending on the number of guests or

the length of stay.

4. Create all needed pages (if you used demo data, these pages are already installed

automatically



): Search Results, Search Availability, Complete Booking, Booking Confirmation,

Booking Cancellation pages. Go to Pages to check these system pages.

Since the Hotel Booking plugin is optimized for Gutenberg, you can add any content (e.g.

bookable units, availability calendars, etc. as blocks).

Read more about Gutenberg blocks for Hotel Booking.

Please note: there are different rooms directory layout examples under ‘Rooms & Suites”. You

can set the preferable layout by adding the ‘Accommodation types listing’ block in Gutenberg

and choosing the needed layout style (make sure to preview the result on the frontend).

5. Navigate to configure general plugin Settings and



Payment gateways.



For more payment

gateways that you can add and enable without tech help, use our custom-crafted

WooCommerce Integration extension for Hotel Booking.

6. Configure Language



settings.

7. Create your booking rules to manage all or individual accommodations: go to Bookings →

Booking rules.



These rules allow you to set minimum and maximum check-in and check-out

dates, minimum and maximum stay-in days for all or individual accommodations. Also, using

this menu you’ll be able to block the booking option for chosen accommodations at specific

periods of time.

8. Apply taxes and fees under Bookings →



Taxes & Fees.

9. Customize the search form. The plugin by default features the check-in and check-out search

form fields, which are necessary. The rest of the fields depend on your needs.

Additionally, the plugin by default also uses “adults” and “children” search field values. If you

use demo data, these fields will be hidden in the search form automatically.

But if you need to hide them manually, you just need to untick several boxes in the plugin

settings under “Guest Management”:

If you operate multiple accommodation, with different room categories, rates, etc., you can

easily create a custom room search form using Accommodation menu → Attributes → Add

New.



In this menu, you need:

● Add the attribute type (e.g. room type)

● Add its values (e.g. double room, single room)

● Assign the needed values to the needed “accommodation types”.

You can add as many custom attributes as you wish. Attributes can be used:

- As advanced search form sorting options

- For displaying extra details in the directory of rooms.

10. Optionally sync bookings with external calendars via iCal (under Bookings →



Sync

calendars).

11. To view, add or delete your real booking requests, go to Bookings



menu.

The plugin is translated into 14 languages. By default it’s in the language set in your WordPress

global language settings (Settings →



General).

This is just a quick guide! For more details and hints take a look at the Hotel Booking plugin

documentation



Once all rental units data are added and the settings are configured, you can customize the

website.

Set up the front page

Here are the steps to follow to set up the front page:

1. Go to Pages → Add New and add a page.

Note: if you used the sample data installer, Home



- Front page



should already be among the

default pages and you can customize it without creating a new page.

In this case, disregard the steps 2, 3 and 4.



Label it appropriately, e.g. home page, front page



3. In the Gutenberg Page Attributes



panel, select the preferable template



(“Front page” is the

default one for the home page).

4. Publish your page.

5. Go to Settings → Reading: set ‘Front page displays’ to Static Page.

6. Select the ‘Homepage’: choose the one you created during the step #2 and save changes.

Customize the front page

General website customization settings can be modified via the WordPress Customizer and the

Gutenberg core editor.

Go to the front page you created during the previous steps. You’ll be able to edit the page

visually via the Gutenberg block-based WordPress editor in visual mode.

Note: you’ll see the respective blocks for all these plugins in Gutenberg only in case you

installed and activated the recommended plugins.

You can definitely play with all these and other blocks on any website page, not just the front

page.

The front page of Luviana by default contains (if you imported sample data) many fully

customizable blocks (click on the needed block to edit it). Here are the content elements in the

header:

● The Header slider features the featured images of the ‘child pages’ of the front page:

So to update each image, go to the needed post (you can add more or delete unneeded ones).

The rest of the content on the page after the ‘Read more’ tag is what visitors will see by clicking

on the ‘More info’ button.

You can also add a video to the front page slider instead or in addition to



images. You can set

a video as the first slide via Appearance → Customize → Theme Options → Front page slider→

Enable video as a first slide → select video (upload it from your computer). You can also

optionally add a “Video poster” that will be displayed as a thumbnail in the right area of the

slider. The slider supports all major video file formats.

If you want to add some text lines over the video, fill in Video title and Video caption fields:

If you “Enable one-line text fitting for the title”, the slide titles will be automatically transformed

into one line (the font will adjust automatically).

In the same menu, you can set up general slider settings, such as automatic slideshow,

animation speed, etc.

Check all video examples in the Luvian demo.

● The property/room search form on the front page can be customized via Appearance

→ Widgets → Front page → Search Availability.

You can also use Getwid to edit other website elements. The main top-level block is Section,

where you can put other smaller blocks. Here are just a few examples:

● The Image Stack Gallery block, where you can update the gallery size and image sizes

● Custom headings with diverse typography (tweakable fonts, sizes, etc.) are added with

the Advanced Heading block.

● The ‘Our Amenities' section is a combination of the Section (Getwid) and Column

(Gutenberg) blocks; Image Box, Paragraph and other blocks are put inside them.

● You can change the style and the color scheme of buttons.

● All the footer widget sections can be edited via Appearance → Widgets → Footer

Bottom 1,2,3,4 → Add widgets.

You can also add any preferable widgets to the “Page Sidebar” - they will be displayed on the

pages with the ‘With sidebar’ page template (“Page Attributes” in the Gutenberg panel).

All other block examples can be discovered on the ‘Blocks’ page. All of them can be edited via

Getwid and Gutenberg and moved to any page you want.