If you’d like to create a new header or add extra buttons/links that trigger the login or register modals in Elementor Pro, follow these simple steps:

Edit the Page in Elementor

• Open your page in Elementor and add a new button or link where you’d like it to appear.

Edit the Button

• Click on the button to edit it.

Set the Button ID for Login or Register Modal

• For a Login modal, enter wprentals_elementor_login in the Button ID field.
• For a Register modal, enter wprentals_elementor_register in the Button ID field.

Customize the Button

Customize the button design and text as needed.

Save and Test

Alternatively, you can add the IDs “wprentals_elementor_login” and “wprentals_elementor_register” in the CSS ID field ( Advanced Tab ) for any other Elementor item.

The post How to Add Login | Register Modal in Elementor Buttons appeared first on WP Rentals Help.

.header_wrapper.customnav {
margin-top: 40px;
}

.top_bar_wrapper {
position: fixed;
}

This ensures that the top bar remains fixed at the top of the page and adjusts the main header positioning accordingly.

You can add custom CSS in Theme Options > Design > Custom CSS. The changes you make here will not be overwritten when you update the theme.

To see the CSS changes, you may need to clear cache from WpRentals Cache (if enabled).

If your CSS changes are not showing up, it may be due to incorrect CSS code or browser caching. As an alternative, you can use the WordPress Customizer (a default WordPress feature), which allows you to preview changes immediately and helps bypass cache issues.

The post How to display top bar in sticky header with Custom CSS appeared first on WP Rentals Help.

Go to Menus

• In your WordPress dashboard, navigate to
  Appearance > Menus

Create a Top-Level Menu Item

• Add a custom link or page that will act as the mega menu parent item

• This parent item must have sub-items underneath it (the columns and links in the mega menu)

Add Submenus

• Add menu items under the parent — these will be the column headers

• Under each of those, add more nested items — they will be the links inside the columns

Enable Mega Menu Format

• Click on the parent menu item (top level)

• In the WpRentals custom menu fields (visible only when WpRentals is active), check the box: “Set as Mega Menu”

Save the Menu

Assign the Menu 

Make sure this menu is assigned to the Main Menu location under Menu Settings 

How to add background color:

To add background color to the mega menu content, use CSS. See example below.  Change the color code to your color code.

background-color: #fafafa;

The post How to Enable and Use the Mega Menu appeared first on WP Rentals Help.

• The Submit Property and Login/Register buttons are in the Menu section.
• They guide users to the respective pages for submitting properties or signing in/up.

Before you disable the buttons, please read below about the purpose of the 2 buttons.

Purpose of the Submit Property Page

The Submit Property page is the first step for users who want to add property listings to your site.

Important notes:

• Users must register or log in before they can complete the submission.

• If a user does not register, any property they submit will be saved as an “orphan listing.”

• Orphan listings may be automatically deleted based on your theme setting under:
  Dashboard → Theme Options → General → Orphan Listings (Learn more).

Purpose of the Login & Register

Users need to log in or register to:

• Submit property listings

• Send booking requests

How it works:

• Clicking the Login/Register buttons triggers a modal window with registration and login forms.

• If a user tries to send a booking request without logging in, the modal will still appear—ensuring only logged-in users can proceed.

• These buttons can be disabled from the Header/Menu settings in Theme Options.

• For websites where users only need to send booking requests (not list properties), consider enabling the “Single Owner” setting. Learn more.

Hiding the Buttons (Optional)

You can hide the Login/Register and Submit Property buttons via Theme Options:

• Go to Dashboard → Theme Options → Register & Login Options → Login / Register & Submit Display

• To hide:

  • Submit Property button: Set “Show submit listing button in header?” to NO

  • Login/Register modal: Set “Show user login menu in header?” to NO

• Click Save Changes

Optional: Delete the Submit Property Page

If you no longer want users to submit properties:

1. Go to Dashboard → Pages

2. Search for the page named Submit Property

3. Delete it or move it to Trash

The post How to hide the Submit Property And Login / Register buttons appeared first on WP Rentals Help.

Mobile Menu Colors

These settings let you change the mobile menu colors from Header -> Mobile Menu Colors

Mobile Header Background Color
Changes the background color of the mobile header.

Mobile Header Icon Color
Changes the color of the icons in the mobile header.

Mobile Menu Font Color
Changes the font color of the mobile menu items.

Mobile Menu Hover Font Color
Changes the font color when hovering over mobile menu items.

Mobile Menu Item Hover Background Color
Changes the background color when hovering over mobile menu items.

Mobile Menu Background Color
Changes the background color of the mobile menu.

Mobile Menu Item Border Color
Changes the border color of the mobile menu items.

This is the Mobile Menu view – to test the colors you add in Theme Options

The post Mobile Menu: How to change colors appeared first on WP Rentals Help.

CONTENT

• Footer Options
• Footer widgets
• Footer menu
• Footer Colors
• Hide Footer

Footer Options

Footer Elements include the following options:

Show Footer Copyright Area?

• Yes/No toggle

• Choose Yes if you want a copyright message to appear at the bottom of your site.

• Choose No to hide it completely.

Copyright Message

• Type the text you want to display

• Important: Only plain text is allowed — no HTML or links.

Footer Layout section includes the following options:

Wide Footer?

• Yes/No toggle

• When set to Yes, the footer stretches 100% across the screen.

• When set to No, it stays the same width as your content area (boxed layout).

Footer Columns

Choose how the footer columns are laid out. Here are the options:

• 4 equal columns
  Divides footer into four even sections.

• 3 equal columns
  Three equal-sized sections.

• 2 equal columns
  Two equal-sized sections.

• 1 full-width column
  Just one section across the full width.

• 3 columns (1/2 + 1/4 + 1/4)
  Big first column, two smaller ones.

• 3 columns (1/4 + 1/2 + 1/4)
  Wide middle column.

• 3 columns (1/4 + 1/4 + 1/2)
  Big last column.

• 2 columns (2/3 + 1/3)
  Left side larger.

• 2 columns (1/3 + 2/3)
  Right side larger.

Pick the layout that best fits your content and then add the content from Footer Widgets in wp-admin – Appearance – Widgets

Background Image for Footer

• Upload a background image to show behind your footer content.

• Click Upload to add your image.

Repeat Footer Background?

Choose how the background image repeats:

• repeat – Repeats both horizontally and vertically.

• repeat x – Repeats only left to right.

• repeat y – Repeats only top to bottom.

• no repeat – Shows the image once only (no repeating)

Footer widgets

These are the footer area widgets, located at the end of the page.

To add content to the footer columns:

1. Go to: Appearance → Widgets

2. You’ll see 4 footer widget areas (columns).

3. Drag and drop widgets into each one.

Footer menu

To create the menu go to Appearance > Menu. Create a new menu and add the links using the panels listed on the left.

To show links in footer, add the pages / custom links to the Footer Menu and save.

Footer Colors

Important: Do not tick the “On save, give me the CSS code to save in child theme style.css?” option if you want the new colors to apply when saving Theme Options. This option should be ticked only if you plan to manually add the CSS code to style.css , as it will prevent Theme Options from saving styles.

Footer colors are managed from WpRentals Options -> Footer -> Footer Colors

You can change how your footer looks by selecting colors for different parts:

Footer Background Color
Changes the background of the main footer area.

Footer Font Color
Changes the color of the text in the footer.

Footer Widget Title Font Color
Changes the color of the widget titles (like section headings).

Footer Copyright Font Color
Changes the color of the text in the copyright bar.

Footer Copyright Background Color
Changes the background color behind the copyright text.

Just use the color pickers to choose what looks best for your site. No coding needed.

Hide Footer

If wish to hide footer use below CSS:

.subfooter_menu {
display: none;
}

Help article about how to add custom CSS

The post Theme Options – Footer Settings appeared first on WP Rentals Help.

The mobile menu in WP Rentals is specifically designed for responsive devices (screens 1024px wide or less). It is managed independently from the desktop menu and can be activated by clicking on the dedicated mobile menu icon.

How to Manage/Create the Mobile Menu

• Navigate to Admin → Appearance → Menus
  Create a new menu or edit an existing one.

• Edit the Menu
  Use WordPress’s drag-and-drop system to organize the menu items as you like.

How to Add Categories, Areas, Actions, and Cities List Pages to the Menu

• Screen Options
  Enable the categories you wish to see in the left-hand menu options.
• Select Items
  Choose the desired items (Categories, Areas, Actions, Cities) from the left lists.
• Add to Menu
  Click to add the selected items to the menu structure.

How to Make Sub-Menus Open on Responsive Devices

• Create Link Menus
  For sub-menu items, create link menus with “#” as the link.
• Add Sub-Menu Items
  Under the parent menu item, add the sub-menu items as usual.

How to Assign a Menu as Mobile Menu

• Menu Settings
  In the menu settings, assign the created or edited menu to be the mobile menu.

Mobile Menu Settings

This screenshot displays the Mobile Menu Settings in the WP Rentals theme.

Go to Header -> Mobile Menu Settings 

Enable Sticky mobile menu header?

• Yes / No Toggle
• If enabled (Yes), the mobile menu header will remain fixed (sticky) at the top of the screen when scrolling.
• If disabled (No), the mobile menu header will scroll along with the page.
• Important Note: This setting does not apply if “Show top bar on mobile devices?” is set to Yes (found in the Top Bar Widget Area settings).

Mobile Menu Colors

These settings let you change the mobile menu colors in Header -> Mobile Menu Colors

Mobile Header Background Color
Changes the background color of the mobile header.

Mobile Header Icon Color
Changes the color of the icons in the mobile header.

Mobile Menu Font Color
Changes the font color of the mobile menu items.

Mobile Menu Hover Font Color
Changes the font color when hovering over mobile menu items.

Mobile Menu Item Hover Background Color
Changes the background color when hovering over mobile menu items.

Mobile Menu Background Color
Changes the background color of the mobile menu.

Mobile Menu Item Border Color
Changes the border color of the mobile menu items.

How to Change the Icon for the User Menu on Mobile

To customize the user menu icon on mobile, add the following CSS in Theme Options → Custom CSS:

Add the below custom css in Theme Options -> Custom Css – https://help.wprentals.org/article/3029/

.fa-cogs:before {
    content: "\f041";
}

The icon code – f043 – you can take from fontawesome 4 – https://fontawesome.com/v4.7.0/icons/

The post Mobile Menu Management in WP Rentals appeared first on WP Rentals Help.

Overview

• Supports one main menu with up to 3 levels of dropdown sub-menus.

• Built-in Mega Menu support for advanced, multi-column layouts.

• Allows creation of separate menus for:

  • Primary (Main) Menu

  • Footer Menu

  • Mobile Menu

How to Create a New Menu

• Go to Appearance → Menus in your WordPress dashboard.

• Click “Create a New Menu” and give it a name.

• Use the panels on the left to add menu items:

  • Pages – Add existing pages.

  • Custom Links – Add any external or custom link.

  • Categories, Actions, Areas, and Cities – Add filtered property listing pages.

• Use drag-and-drop to reorder or nest items.

• Assign the menu to a location:

  • Primary Menu

  • Footer Menu

  • Mobile Menu

• Click “Save Menu.”

How to Add Menu Items

Add a Page:

• Find the desired page in the Pages panel.
• Check the box and click “Add to Menu.”

Add Custom Links:

• Open the Custom Links panel.
• Enter the URL and link text, then click “Add to Menu.”

Open in New Tab/Window:

• Expand a menu item by clicking the dropdown arrow.
• Check “Open link in a new tab.”

Save the menu.

Select the page and Click add to Menu

Or add custom links to menu

Set menu items to open in new windows

Use drag and drop to re-order the menu where you want

How to Enable and Use the Mega Menu

In WpRentals, a mega menu allows you to create advanced, multi-column dropdown menus—ideal for showcasing a large number of links, categories, or custom elements in a structured and visually appealing way.

Go to Menus

• In your WordPress dashboard, navigate to
  Appearance > Menus

Create a Top-Level Menu Item

• Add a custom link or page that will act as the mega menu parent item

• This parent item must have sub-items underneath it (the columns and links in the mega menu)

Add Submenus

• Add menu items under the parent — these will be the column headers

• Under each of those, add more nested items — they will be the links inside the columns

Enable Mega Menu Format

• Click on the parent menu item (top level)

• In the WpRentals custom menu fields (visible only when WpRentals is active), check the box: “Set as Mega Menu”

Save the Menu

Assign the Menu 

Make sure this menu is assigned to the Main Menu location under Menu Settings 

How to Add a Background Color to the Mega Menu

To add background color to the mega menu content, use CSS. See example below.  Change the color code to your color code.

background-color: #fafafa;

How to Edit an Existing Menu

• Go to Appearance → Menus.

• Use the dropdown at the top to select an existing menu.

• Click “Select.”

• Add, remove, or reorder items as needed.

• Click “Save Menu.”

How to Add Categories, Areas, Actions, and Cities to Your Menu

• At the top-right of the Menus page, click Screen Options.

• Check the boxes for:

  • Categories
  • Action / What do you rent?
  • City
  • Area / Neighborhood
  • Property Status
  • Features & Amenities

• Panels for these items will appear on the left.

• Select the items you want and click “Add to Menu.”

• Use drag-and-drop to organize them, then click “Save Menu.”

How to Make Sub-Menus Open on Mobile Devices

To make sub-menus responsive for iPads and phones:

1. Create a parent menu item with a # as the custom link URL.
2. Add sub-menu items under the parent menu item.
3. Save the menu.

The post Menu and Mega Menu Setup appeared first on WP Rentals Help.

There are no limits to the number of pages you can create — and you can set any page as your site’s homepage.

Video Tutorials

Steps to Create and Select a Homepage

• To create a new page go to Admin -> Pages -> Add New Page -> Add content and click Publish when you’re done.
• Make sure that Default Template (for Bakery) or Elementor Full Width (for Elementor) is selected in the Page Attributes panel.
• After you create the new page, go to Settings -> Reading and check the static page option as “Homepage“.
• Then select the name of the page you’ve already created and hit save.

The post How to Set Up Your Homepage appeared first on WP Rentals Help.

This is an example for how to add a different icon. You can choose your icon code as you wish

i.fas.fa-cogs {
margin: 25px 0px;
}

.mobile-trigger-user:before {
content: "\f007";
font: normal normal normal 14px/1 FontAwesome;
font-size: 30px;
}

.fa-cogs:before{
display:none;
}

To change icons for My reservation:

.fa-folder-open:before {
content: "\f236" !important; /* Folder Icon */
}

To change the icons for My bookings:

i.far.fa-folder-open:before {
content: "\f02e" !important; /* Book Icon */
}

If you prefer to adding the css in child theme:

Help to install child theme https://help.wprentals.org/article/how-to-activate-child-theme/
Add the css in Child theme style.css

If you prefer adding the css as custom css

You can add custom CSS in Theme Options > Design > Custom CSS. The changes you make here will not be overwritten when you update the theme.

To see the CSS changes, you may need to clear cache from WpRentals Cache (if enabled).

If your CSS changes are not showing up, it may be due to incorrect CSS code or browser caching. As an alternative, you can use the WordPress Customizer (a default WordPress feature), which allows you to preview changes immediately and helps bypass cache issues.

The post How to change the login Icon on Mobile Menu and icons for My bookings or My Reservations with CSS appeared first on WP Rentals Help.