• Facebook
  • Twitter

General information


Thank you for purchasing Estato! We’re very pleased that you have chosen our plugin to extend your website. We’re doing our best not to disappoint you! Before you get started, please check out these documentation pages. Estato can only be used with WordPress and we assume that you already have it installed and ready to go. If you don’t, please see WordPress Codex to get started.


Requirements for Estato


Before using Estato, please meet the following requirements:

  • essentials to run WordPress – here you can find more information – in case any doubts regarding the server, contact your host provider,
  • latest version of WordPress, which you can download here,
  • create secure FTP and Database.

What’s Included


When purchasing our theme from Themeforest, you need to download the Estato files from your Themeforest account. Navigate to downloads tab on Themeforest and find Estato. Below you’ll find a full list of what is included the .zip file, along with a brief description of each item.
Estato Folder contains:

    • estato-theme.zip – main installation folder

Support


All of our items come with free support. For some help you can reach to our dedicated support forum. Free support is limited to questions regarding the themes features or problems. We provide premium support for code customizations or third-party plugins. If you need help with anything other than minor customizations of your theme, feel free to contact us on premium@createit.pl.

For free support, follow the steps below

  • Step 1Click Here to create a free forum account. You’ll need your Themeforest purchase code, which can only be received when purchasing the theme from Themeforest.net.
  • Step 2 – Enter your Themeforest Purchase Code, an e-mail and a password.
  • Step 3 – Once you have an account, sign in to the forum and get started.
  • Step 4 – Find your theme on a forum home page.
  • Step 5 – Create new issue by clicking on a button at the right.

Before You Post On a Forum

We urge you to follow the steps below, before you post a new topic on the forum, to speed up your request. It’s in everyones interest and will benefit in making the entire forum more efficient:

  • Step 1 – Always check the Documentation and the Knowledgebase Section. Most questions are already answered in those areas.
  • Step 2 – Always use our Forum Search before you post, it’s possible that your issue has already been brought up and answered.
  • Step 3 – If your question hasn’t been brought up, please post a new topic. Always be as specific as possible. Creating a topic requires entering the live URL to your home page or page that shows the issue in question. It also has bars for WP and FTP login info, which aren’t required, however, providing us with your login information can save a lot of time for both of us. Login credentials are securely stored and accessible only by our support staff.
  • Step 4 – We usually answer questions in 24 hours on working days. However if you don’t get any answer in 72 hours bump up your question or send us an e-mail.

Our support hours: 10:00 AM – 6:00 PM UTC +1 on Monday to Friday.

Premium Support

We can create your website from scratch, redesign it or just extend the current ones. For more information, please take a look at our website.

Typical issues covered by Premium Support:

  • Custom CSS
  • Support for third party software and plug-ins
  • WordPress Installation with Theme configuration
  • Server configuration
  • Site structure modifications
  • Graphic adjustments, etc.
  • WordPress general howto’s

Installation via Administration Panel


If Estato files are downloaded from your Themeforest account, you can start an installation using WordPress administration panel.

Once you’ve logged in to your administration panel go to Appearance > Themes. Depending on your version of WordPress, you’ll see Add New or two other tabs: Manage Themes and Install Themes.

Themes section

Themes section

Here you can find instructions how to proceed with 3.9.0 and lower versions of WordPress.

 

If you’re using newer version, follow steps below to install the theme:

    • Step 1 – click on Add New
      Add New

      Add New

    • Step 2 – choose Upload Theme option to upload .zip file
      Upload theme

      Upload theme

    • Step 3 – choose estato-theme.zip from you computer.
    • Step 4 – once file is chosen click Install Now
      Install theme now

      Install theme now

    • Step 5 go to Appearance > Themes and Activate Estato

      Activating theme

      Activating theme

  • Step 6 After activating {Theme} you will be send to Theme installation instruction steps. By following this steps you will be able to activate required plugins, activate them, import demo content (required) and install sample of WPL content.
    Theme installation instructions

    Theme installation instructions

  • Common Install Error: Are You Sure You Want To Do This?

    If you get the following question message when installing Estato.zip file via WordPress, it means that you have an upload file size limit. Install the theme via FTP or call your hosting company and ask them to increase the limit.


    Installation via FTP


    To install Estato via FTP, follow steps below:

    • Step 1 – Unarchive estato-theme.zip file
    • Step 2 – Access your host web server using FTP client
    • Step 3 – Find directory wp-content > themes
    • Step 4 – Put folder Estato in directory wp-content > themes
    Installation directory

    Installation directory


    Learn more:

    WordPress codex – FTP clients


    Activating plugins


    Estato comes with number of custom features like:

    • portfolio items,
    • faq items,
    • testimonials,
    • estato custom shortcodes,
    • sass compiler

    For the correct operation of Estato you have to install and activate them for Estato:

    After activating Estato you will also get the information about all of theplugins that you should or can install and activate for the full experience of the Theme.  You can find this information on path Appearance > Theme Installation.

     

    Also the information about all required plugins that should be installed and activated you will find in WordPress dashboard on path Appearance > Theme Installation

    Theme installation instruction

    Theme installation instruction

    With these plugins your custom post types will be saved in your admin panel, even if you change your WordPress theme.

    Notice: Plugin must be installed and activated right after you install and activate the Estato – otherwise you might be encountered problems with correct theme functioning.

    Install plugin

    Install plugin


    Import demo content


    The fastest and easiest way to import our demo content is to use Theme Options 1-click Demo Importer. It will import all pages and posts, several sample sliders, widgets, theme options, assigned pages, and more.

    We recommend this approach on a newly installed WordPress. It will replace  the content you currently have on your website. However, we create a backup of your current content in (Tools > Backup). You can restore the backup from there at any time in the future.

    Backup option

    Backup option

    To import our demo content, please follow the steps below:

    Theme installation instructions

    Theme installation instructions

    • Step 1 – install and activate plugins listed in Theme installation instructions message
    • Step 2 – in dashboard go to Unyson and make sure that Backup & Demo Content extansion is activate
      Install Unyson extension

      Install Unysone extension

    • Step 4 – navigate to Tools where after activating the Unyson extansion Demo content Install option will be avaliable
      Demo content install

      Demo content install

    • Step 5 – choose import option you want to use from avaliable options
      Demo Content install options

      Demo Content install options

    • Step 6 – wait untill the content will be installed
      Installing new content

      Installing new content

    Importing can take a few minutes. Please be patient and wait for it to complete. Once it will be loading, you will see message with indicating progress.


    Estato Customize


    Estato comes with an advanced customizer, which allows to edit most of the theme elements in one place. If you want to use it, navigate to Appearance > Customize

    Customizer

    Customizer

    It will display a panel with tabs corresponding to all theme sections, such as:

    • Style
    • Widgets
    • Header
    • Footer
    • Blog
    • Single blog post
    • Portfolio
    • Faq
    • Template pages
    • Properties page
    • Single agent page
    • Agent page

    You will also find the main style settings:

    • General
    • Colors
    • Header Image
    • Background Image

    In General you can turn off/on preloader on the site, check onepager option if you want to have onepager site (more info about onepager site HERE).

    General settings

    General settings

    In  Estato Color section you can choose colors used in the theme

    Color settings

    Color settings

    In Header Image section you can edit logo on the site

    Header Image settings

    Header Image settings

    Customize option will also give you option to set image as a background for the theme:

    Background Image settings

    Background Image settings

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Header


    Header settings

    Header settings

    In Header content tab you can define the following settings:

    1. Header behavior
      • Scroll Up Both
      • Scroll Up Menu
      • Scroll Up TopBar
      • Fixed both – Menu & TopBar – menu and TopBar fixed to the top when scrolling
      • Hide Menu – menu hidden when scrolling, TopBar will be fixed to the top
      • Fixed Menu – menu fixed to the top when scrolling (if TopBar is displayed it will be hidden after scrolling)
    2. Header type
      • Equal TopBar and Navbra
      • Small TopBar, big NavBar
    3. TopBar – Check if you want to display TopBar
      TopBar section

      TopBar section

    4. TopBar motive – choose color TopBar pattern
      • Light motive
      • Dark motive
    5. TopBar motive – choose to display login on text in TopBar
      • Text
      • Login option
    6. Text in TopBar – write text to display in TopBar
    7. E-mail adress in TopBar – add e-mail adress that will be visible in the TopBar
      E-mail adress in TopBar

      E-mail adress in TopBar

    8. Search in TopBar
      Search option avaliable in TopBar

      Search option avaliable in TopBar

    9. Bottom line – check Yes if you want to display bottom line
    10. Border at menu – check Yes if you want to show border at top menu
    11. Button in NavBar – add or hide button
      Button in TopBar

      Button in TopBar

    12. Button title – add text visible in the button
    13. Button link – add link to were you want the button to lead to
    14. Open link in new window – check Yes to display button link in new window

     

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Static front page


    In Static Front Page content tab you can define which of the created Pages will be used as a site Home page and which page will be used as a Blog page (avaliable for static page option).

    Static Front Page settings

    Static Front Page settings

    1. Front page display
      • Your latest posts – latest posts will be shown on the Front page
      • A static page – Home page and Blog index page will be chosen from list of static pages.
    2. Front page – avaliable if A static page option is chosen, set page that will be shown as a Front page
    3. Posts page – avaliable if A static page option is chosen, set page that will be shown as a Posts page

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Footer


    In Footer content tab you can define the following settings:

    Footer settings

    Footer settings

    Footer section

    Footer section

    1. Footer display – check Yes if you want to display footer
      Footer - 4 columns/dark motive

      Footer – 4 columns/dark motive

    2. Footer color
      • Light Motive
        Footer Light motive

        Footer Light motive

      • Dark Motive
    3. Background image – set background image for footer.
    4. Number of footer columns
      • One column
      • Two columns
      • Three columns
      • Four columns
    5. Post footer display – check Yes if you want to display post footer on site
      Post Footer - 2 columns

      Post Footer – 2 columns

    6. Number of post footer columns (will work only if the Post footer display opion will be checked)
      • One column
      • Two columns

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Index Blog page


    Blog settings

    Blog settings

    In Blog content tab you can define the following settings for Blog Index page.:

    Blog Index

    Blog Index

    1. Display blog sidebar – Check Yes if you want to display sidebar with widgets on blog page.
      Blog Index page - sidebar right

      Blog Index page – sidebar right

    2. Place to display sidebar – Chose place for blog sidebar
      • Left side
      • Right side
    3. Display breadcrumbs – Check Yes if you want to show them on the top of the blog page
      Breadcrumbs from Blog index page

      Breadcrumbs from Blog index page

    4. Display head section blog – Check Yes if you want to display head section on the blog page
      Head section for Index page

      Head section for Index page

    5. Head section type
      • Parallax
      • Video
      • Ken Burns
    6. Mobile background image – select the image that will be displayed on mobile devices
    7. Background image – select image to display in head section
    8. Second background image – this image will be visible only if the Ken burnshead section type will be selected
    9. Third background image – this image will be visible only if the Ken burnshead section type will be selected
    10. Head height
    11. Parallax ratio
    12. Video url – will only work when the head section type is set to Video
    13. Video file type
      • Mp4 direct link
      • Webm direct link

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Single blog post


    Single Blog post settings

    Single Blog post settings

    In Blog content tab you can define the following settings for Blog single page.:

    Single blog pages

    Single blog pages

    1. Display blog sidebar – Check Yes if you want to display sidebar with widgets on blog page.
      Single blog post - sidebar right

      Single blog post – sidebar right

    2. Place to display sidebar – Chose place for blog sidebar
      • Left side
      • Right side
    3. Display breadcrumbs – Check Yes if you want to show them on the top of the blog page
      Breadcrumbs from Blog single post

      Breadcrumbs from Blog single post

    4. Display head section in blog – Check Yes if you want to display head section on the blog page
      Head for Blog Single post section

      Head for Blog Single post section

    5. Head section type
      • Parallax
      • Video
      • Ken Burns
    6. Mobile background image – select the image that will be displayed on mobile devices
    7. Background image – select image to display in head section
    8. Second background image – this image will be visible only if the Ken burnshead section type will be selected
    9. Third background image – this image will be visible only if the Ken burnshead section type will be selected
    10. Head height
    11. Parallax ratio
    12. Video url – will only work when the head section type is set to Video
    13. Video file type
      • Mp4 direct link
      • Webm direct link
    14. Tags after post – check Yes if you want to show tags after post
    15. Social share – check Yes if you want to show social share
    16. Social share – check social icons you want to show on your post page
    17. Post author info – check Yes if you want to show information about the author of this post
    18. Display comments after post

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Portfolio


    Portfolio settings

    Portfolio settings

    In Portfolio content tab you can define the following settings for Portfolio Index page.:

    Portfolio Index page

    Portfolio Index page

    1. Display sidebar – check Yes to display sidebar
    2. Place to display sidebar
      • Left side
      • Right side
    3. Display breadcrumbs – check Yes if you want to display breadcrumbs in top of the page
      Breadcrumbs from portfolio index page

      Breadcrumbs from portfolio index page

    4. Display head section – check Yes if you want to display header in top of the page
      Head Section from Portfolio Index

      Head Section from Portfolio Index

    5. Head section type
      • Parallax
      • Video
      • Ken Burns
    6. Mobile background image – select the image that will be displayed on mobile devices
    7. Background image – select image to display in head section
    8. Second background image – this image will be visible only if the Kenburns head section type will be selected
    9. Third background image – this image will be visible only if the Kenburns head section type will be selected
    10. Head height
    11. Parallax ratio
    12. Parallax vertical offset
    13. Parallax horizontal offset
    14. Video url – will only work when the head section type is set to Video
    15. Video file type
      • Mp4 direct link
      • Webm direct link

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Single portfolio


    In Single portfolio content tab you can define the following settings for single portfolio page.:

    Single Portfolio settings

    Single Portfolio settings

    Portfolio single page

    Portfolio single page

    1. Display sidebar – check Yes to display sidebar
    2. Place to display sidebar
      • Left side
      • Right side
    3. Display breadcrumbs – check Yes if you want to display breadcrumbs in top of the page
    4. Display head section – check Yes if you want to display header in top of the page
    5. Head section type
      • Parallax
      • Video
      • Ken Burns
    6. Mobile background image – select the image that will be displayed on mobile devices
    7. Background image – select image to display in head section
    8. Second background image – this image will be visible only if the Kenburns head section type will be selected
    9. Third background image – this image will be visible only if the Kenburns head section type will be selected
    10. Head height
    11. Parallax ratio
    12. Parallax vertical offset
    13. Parallax horizontal offset
    14. Video url – will only work when the head section type is set to Video
    15. Video file type
      • Mp4 direct link
      • Webm direct link

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    FAQ


    In Faq content tab you can define the following settings for Faq page.:

    Faq settings

    Faq settings

    Faq Index page

    Faq Index page

    1. Display breadcrumbs – check Yes if you want to display breadcrumbs in top of the page
      Breadcrumbs from index faq page

      Breadcrumbs from index faq page

    2. Display head section in faq – check Yes if you want to display header in top of the page
      Head section for index

      Head section for index

    3. Head section type
      • Parallax
      • Video
      • Ken Burns
    4. Mobile background image – select the image that will be displayed on mobile devices
    5. Background image – select image to display in head section
    6. Second background image – this image will be visible only if the Kenburns head section type will be selected
    7. Third background image – this image will be visible only if the Kenburns head section type will be selected
    8. Head height
    9. Parallax ratio
    10. Parallax vertical offset
    11. Parallax horizontal offset
    12. Video url – will only work when the head section type is set to Video
    13. Video file type
      • Mp4 direct link
      • Webm direct link
    14. Faq page title – create title for main FAQ page
    15. Faq page slug – create FAQ page slug (remember to rebuild permalinks after changing it)

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Template pages


    In Template pages content tab you can define the following settings for template pages: Terms & Conditions,  Private Policy, Contact Us:

    Template pages settings

    Template pages settings

    Faq Index page

    Faq Index page

    1. Display breadcrumbs – check Yes if you want to display breadcrumbs in top of the page
      Breadcrumbs from index faq page

      Breadcrumbs from index faq page

    2. Display head section in template pages – check Yes if you want to display header in top of the page
      Head section for index

      Head section for index

    3. Head section type
      • Parallax
      • Video
      • Ken Burns
    4. Mobile background image – select the image that will be displayed on mobile devices
    5. Background image – select image to display in head section
    6. Second background image – this image will be visible only if the Kenburns head section type will be selected
    7. Third background image – this image will be visible only if the Kenburns head section type will be selected
    8. Head height
    9. Parallax ratio
    10. Parallax vertical offset
    11. Parallax horizontal offset
    12. Video url – will only work when the head section type is set to Video
    13. Video file type
      • Mp4 direct link
      • Webm direct link

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Single property page


    In Single property page content tab you can define the following settings for Single Property element: Single property element

    Single property page settings

    Single property page settings

    Property single page

    Property single page

    1. Display breadcrumbs – check Yes if you want to display breadcrumbs in top of the page
      Breadcrumbs from agent single page

      Breadcrumbs from agent single page

    2. Display head section – check Yes if you want to display header in top of the page
      Head section for property single agent page

      Head section for property single agent page

    3. Head section type
      • Parallax
      • Video
      • Ken Burns
    4. Mobile background image – select the image that will be displayed on mobile devices
    5. Background image – select image to display in head section
    6. Second background image – this image will be visible only if the Kenburns head section type will be selected
    7. Third background image – this image will be visible only if the Kenburns head section type will be selected
    8. Head height
    9. Parallax ratio
    10. Parallax vertical offset
    11. Parallax horizontal offset
    12. Video url – will only work when the head section type is set to Video
    13. Video file type
      • Mp4 direct link
      • Webm direct link
    14. Publish info – display info about publish date
      Publish info

      Publish info

    15. Update info – check Yes if you want to show update date
      Update info

      Update info

    16. Report abuse link – check Yes if you want to show abuse link
      Report abuse link

      Report abuse link

    17. Report Abuse page – choose page to which user will be send, after clicking ‘report abuse’ link

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Single agents pages


    Single agents page settings

    Single agents page settings

    In Single Agent page content tab you can define the following settings for Agents Index page.:

    Agent single page

    Agent single page

    1. Display breadcrumbs – check Yes if you want to display breadcrumbs in top of the page
      Single agent's breadcrumbs

      Single agent’s breadcrumbs

    2. Display head section – check Yes if you want to display header in top of the page
      Head section from agent single page

      Head section from agent single page

    3. Head section type
      • Parallax
      • Video
      • Kenburns
    4. Mobile background image – select the image that will be displayed on mobile devices
    5. Background image – select image to display in head section
    6. Second background image – this image will be visible only if the Ken burnshead section type will be selected
    7. Third background image – this image will be visible only if the Ken burnshead section type will be selected
    8. Head height
    9. Parallax ratio
    10. Parallax vertical offset
    11. Parallax horizontal offset
    12. Video url – will only work when the head section type is set to Video
    13. Video file type
      • Mp4 direct link
      • Webm direct link

    Notice:

    All changes made with customizer will only be applied when you click on

    save


    Calculator landing page


    In Calculator landing page content tab you can define the following settings for Calculate Loan template page.:

    Calculator landing page settings

    Calculator landing page settings

    1. Background image – Image for background in landing page
    2. Section height
    3. Background image for second column – Image for second column in landing page
    4. First title
      First title text example

      First title text example

    5. Second title
      Second title text example

      Second title text example

    6. Text – text use for landing page
      Text example

      Text example

    Notice:

    All changes made with customizer will only be applied when you click on

    save

    Here you will find information how to create contact form visible on this site.


    Estato custom shortcodes


    With Estato comes many custom shortcodes for VC that are used to show content created in Estato. Below you will find short information about this VisualComposer elements:

    Button for Estato

    This theme come with VC item that gave you option to create buttons that can be used in the theme.

    Buttons for estato item

    Buttons for Estato

    Icon Box for Estato

    Icon Box example

    Icon Box example

    Below you will see all the avaliable options that can or need to be set to use IconBox for Estato element on page:

    Icon Box for Estato Settings

    Icon Box for Estato Settings

    General

      • Number of icons – you can set here number of icons visible in row (1, 2, 3, 4). We recommend to use one Pricing tables for Estato element in single row to get the best effect using this element.
      • Motive – choose color style used for this element
        1. Dark
        2. Light
      • Title – Set the title for this element
    Icon Box for Estato Settings

    Icon Box for Estato Settings

    Column 1, Column3, Column 3, Column 4  (number of columns tab depends on the nuber of tables set in General tab)

      • Title
      • Icon
      • Description
    Icon Box for Estato settings

    Icon Box for Estato settings

    Button  (add button under Icon Boxes) 

      • Buttn enable
      • Button title
      • Button link
      • Button size
      • Button style
      • Trabsparent Estato Style for button? – check Yes to tur on the option
      • Custom CSS class for button

    Create Icon Box example like on the Icon Box example image:

    To create a Icon Box section with a background static image:

      • Step1: Create a row section
        Add Row section

        Add Row section

      • Step2 :  Choose the Edit row option (1) and in the General tab add the background image (2) from Media library gallery.

         

        Adding background image

        Adding background image

      • Step3: Add Icon Box For Estato by clicking  in Row and choosing it from Add Element options

         

        Adding Icon Box for Estato

        Adding Icon Box for Estato

      • Step4: Set the shortcode options as you wish.

    Remember to Update the changes on the page to save them.

    Image carousel

    Image carousel example

    Image carousel example

    Below you will see all the avaliable options that can or need to be set to use Image carousel for Estato element on page:

    Image carousel Settings

    Image carousel Settings

    General

      • Title
      • Display navigation – check Yes to show the navigation of the carousel
      • Items count – number of images that wil shown at once on the desktop (this option will not work the mobile version of the carousel)
      • Pagination – check Yes pagination to show it.
      • Autoplay – check Yes to show pagination
      • Images – add images from Media Library or Upload Files from your computer

    Latest Posts

    Latest Posts

    Latest Posts

    You can custom this element using options from the settings option below.

    Latest posts settings

    Latest Posts settings

    General

      • Title
      • Limit
      • Custom class
      • Order
        1. Ascending
        2. Descending
      • Order by
        1. Date
        2. ID
        3. Author
        4. Title
        5. Slug
        6. Modifier
        7. Order by parent id
        8. Random order
        9. Order by Page order
    Latest Posts settings

    Latest Posts settings

    Button 

      • Button enabled
      • Button title
      • Button link
      • Button size
        1. Default
        2. Extra Small
        3. Small
        4. Large
      • Button style
        1. Estato Default
        2. Estato Primary
        3. Estato Success
        4. Estato Info
        5. Estato Warning
        6. Estato Danger
        7. Estato Dark
        8. Estato Link
      • Transparent Estato Style for button?  – check Yes to remove button background color
      • Custom CSS class for button

    Promo Section

    Promo section

    Promo section

    Creating your own promo section you can choose options as below:

    Promo Section settings

    Promo Section settings

    General

      • Background color
      • Image
      • Promo text
      • Promo text color
    Promo Section settings

    Promo Section settings

    Button 1, Button 2, Button 3

      • Button enabled – check Yes to show the button
      • Button title
      • Button link
      • Button size
        1. Default
        2. Extra Small
        3. Small
        4. Large
      • Button style
        1. Estato Default
        2. Estato Primary
        3. Estato Success
        4. Estato Info
        5. Estato Warning
        6. Estato Danger
        7. Estato Dark
        8. Estato Link
      • Transparent Estato Style for button – check Yes to remove button background color
      • Custom Css class for button

    How to achieve full width Promo Section:

      • Step1: Create a row section
        Add Row section

        Add Row section

      • Step2 :  Choose the Edit row option (1) and in the General tab set the Row strech option (2) to Strech row and content.
      • Row stretch options

        Row stretch options

      • Step3: Add Promo Section item to the row and set the options as you wish.
        Add Promo Section

        Add Promo Section

    Remember to Update the changes on the page to save them.

     

    Pricing tables for Estato

    Pricing Tables for Estato

    Pricing tables for Estato

    Below you will see all the avaliable options that can or need to be set to use Pricing tables for Estato element on page:

    Pricing tables for Estato Settings

    General

      • Title – here you can set the title visible over the tables
      • Number of tables – you can set here number of tables visible in row (1, 2, 3, 4). We recommend to use one Pricing tables for Estato element in single row to get the best effect using this element.

    Column 1, Column3, Column 3, Column 4  (number of columns tab depends on the nuber of tables set in General tab)

    Pricing tables for Estato Settings

    Pricing tables for Estato Settings

      • Title (1)
      • Value (2)
      • Subvalue (3)
      • Tag (4)
      • Features (5)
      • Button enabled (6) – check Yes to show button
      • Button title
      • Button link
      • Button size
        1. Default
        2. Estra Small
        3. Small
        4. Large
      • Button style
        1. Estato Default
        2. Estato Primary
        3. Estato Success
        4. Estato Info
        5. Estato Warning
        6. Estato Danger
        7. Estato Dark
        8. Estato Link
      • Transparent Estato style for button? – check Yes option if you want the transparent style
      • Custom CSS class for button – set your custom class to style the button

     

    Twitter

    Twitter

    Twitter

    Below you will see all the avaliable options that can or need to be set to use Twitter in your Estato template:

    Twitter settings

    Twitter settings

      • Title – set the title for header
      • Simple style?
        1. No
        2. Yes
      • username – twitter username
      • customer key
      • customer secret
      • token
      • token secret
      • limit – limit of visible tweets
      • Tweets per slide
      • follow us button – follow us button label (leave blank to hide it)
      • new window? – Yes/No
      • parse url
        1. plain text
        2. short link
        3. display link
      • parse media
        1. plain text
        2. short link
        3. display link
        4. expened link
      • parse url id? – Yes/No
      • parse hashtag? – Yes/No
      • embed images? – Yes/No
      • size of embeded images?
        1. thumb
        2. small
        3. medium
        4. large
      • tweet length limit
      • cache results for X seconds – cache Twitter feeds for better performance

    The information how to generate twitter keys and tokens can be find here.

    Create Twitter section with background image

    To create a twitter account with a background static image:

      • Step1: Create a row section
        Add Row section

        Add Row section

      • Step2 :  Choose the Edit row option (1) and in the Design Options tab add the background image (2) from Media library gallery.
      • Adding background image

        Adding background image

      • Step3: Add Twitter item to the row and set the options as you wish.
      • Adding Twitter

        Adding Twitter

    Remember to Update the changes on the page to save them.

     

    Scroll Sections

    Terms & Conditions

    Terms & Conditions

    This item will let you create a page menu to let the user move between the section page.

    Scroll Section Settings

    Scroll Section Settings

    The only option avaliable in settings is Section names that will let you create menu links for custom sections. This shortcode is used on Terms & Conditions page of Estato WP theme.

    To recreate this look on your own follow these few easy steps:

    Step1: Add row to your page and change the Row Layout to 1/4 + 3/4. This way you will be able to add Scroll Section and the content to different columns and set them next to each others.

    Row Layout

    Row Layout

    Step2: Add any content you want to the columns on the right.

    Adding content

    Adding content

    Step3: Add an ID to each Inner Row Settings section you want your menu to be able to move to. Remeber: Each created ID must be unique, and it is valid as w3c specification: link (Must not have spaces)

    Adding Row ID

    Adding Row ID

    Step4: Add Scroll Section Settings item to the columns on the right and for the Section names use the same names as the one used for the Row’s id.

    Add Section Names

    Add Section Names

    Remember: to make this element work correctly you must copy the exact same names as used in the ID and add them in the same order as they are set in the right section.

    FAQ

    Faq page created with the use of shortcode

    Faq page created with the use of shortcode

    FAQ Settings

    FAQ Settings

    FAQ shortcode will let you show all the created FAQs items on the site. This version of FAQ don’t have menu like the one created via Customize options, but it will let you add other content on the same site unlike the customize one.

    Testimonials slider

    Testimonial slider

    Testimonial slider

    Testimonial slider will gave you an option to show people testimonials on your site

    How to create testimonial?

    To create testimonial go to Testimonials > Add New where you will be able to create a new item.

    Creating new testimonial item you will be able to add followig:

    Creating testimonial item

    Creating testimonial item

      • Title (A)
      • Content (B)
      • Author (C)
        1. Name
        2. Company
      • Featured Image (D)

    After adding all infortmation to testimonial item remember to click the Update buton.

    Adding Testimonial Slider

    Testimonial slider Setting

    Testimonial slider Setting

    Testimonial slider settings:

      • Style of slider
      • Additional title – check Yes if you want to display title
      • Title
      • Order
        1. Ascending
        2. Descending
      • Order by
        1. Date
        2. ID
        3. Author
        4. Title
        5. Slug
        6. Modifier
        7. Order by parent id
        8. Random order
        9. Order by Page order
      • Limit – set the limit of the testimonials visible on the site (not more than 6)

    How to achieve  the look of this section like on Estato demo: 

    To create testimonial slider from the demo follow steps below:

      • Step1: Create a row section
        Add Row section

        Add Row section

      • Step2 :  Choose the Edit row option (1) and in the General tab set the Row strech option (2) to Strech row and content.
      • Row stretch options

        Row stretch options

      • Step3: Go to Design Options tab and set Background color of choice. The one used in our demo is: #60a7d4
      • Choose background color

        Choose background color

      • Step4: Add Testimonial slider item to the row and set the options as you wish.
        Add testimonial slider

        Add testimonial slider

    Remember to Update the changes on the page to save them.


    Estato custom shortcodes for WPL


    With Estato comes many custom shortcodes for VC that are used to show content created in WPL plugin. Below you will find short information about this VisualComposer elements:

    Agency Box

    Agency Box look

    Agency Box look

    This element have single tab with option to customise the way how the agency box will be shown. This item let you show all the information and the logo used by the Agency.

    Agency box Settings

    Agency box Settings

    General
    • ID  – it can be checked in WPL in User Manager section by:
      • a) Choose User Manager from WPL section
        Going to User Manager

        Going to User Manager

      • b) Copy one of the WPL’s user id to the Agency box Settings
        Avaliable ids

        Avaliable ids

    • Style  – choose the style of the element
        1. Light
          Light version

          Light version

        2. Dark
          Dark version

          Dark version

      To set the background Parallax image for this element please go to the General tab in Row Settings option and add the image via Image option (2) from your Media Library, Set the Parallax type to Simle (1) and set Parallax speed to 1.5 (3)

      Row Settings

      Row Settings

    Agents listing

    Agents listing look

    Agents listing look

    This element have two tabs with option to customise the way how the multiplies profiles of the agents will be visible on the site.

    Agents Listing Settings

    Agents Listing Settings

    General
    • Title – set the title for this section
    • Image Width – set the width of the image
    • Image Height – set the width of the image
    • CSS Class – add custom css class
    Sort and limit
    • Order by
      1. First Name
      2. Country
      3. State
      4. Properties count
    • Order  – set the order of the agents
      1. Ascending
      2. Descending
    • Limit – set limit of the agents visible on the site

    Profile Box

    Profile Box

    Profile Box – Dark

    Profile Box Settings

    Profile Box Settings

    This type of element will let you show all the information about the WPL User chosen by its id. Profile Box have avaliablw two options to custom this element:

    General
    • Default profile id – it can be checked in WPL in User Manager section by:
      • a) Choose User Manager from WPL section
        Going to User Manager

        Going to User Manager

      • b) Copy one of the WPL’s user id to the Profile box Settings
        Avaliable ids

        Avaliable ids

    • Style – this element have 2 avaliable styles:
      Profile Box - Light

      Profile Box – Light

      1. Dark
      2. Light –  this version is using white color for the font and borders, so it won’t be visible on default VC Row background. The background of this element can be changed by
        • a) Click on Edit Row option
          Edit Row options

          Edit Row options

        • b) Go to General tab and choose background color via Background option to make the text visible
        • Item Settings for Row

          Item Settings for Row

        • c) In General Tab, set Row stretch to Stretch row to make the background color full width
        • Row Settings

          Row Settings

    Properties map with searchbox

    Properties map with searchbox

    Properties map with searchbox

    Properties map with searchbox Settings

    Properties map with searchbox Settings

    This element have sigle tab with option to customise the way how the map will be shown on the site:

    Map
    1. Custom map Style – use one of custom maps styles avaliable on Snazzy Maps site (this option is not compatible with Map Type control)
    2. Custom map height – enter map height (in pixels or leave empty for responsive map)
    3. Zoom value – set custom zoom value, eg. 10. Please note the map will automatically expand to show all markers.
    4. Map Type control
      • Theme default
      • Roadmap
      • Satellite
      • Hybrid
      • Terrain
    5. Scale control – choose between Yes/No
    6. Google Maps search control – choose between Yes/No
    7. My position control – choose between Yes/No (Works only with https)
    8. Use custom markers for this map –  choose between Yes/No
    9. Use custom markers for this map –  choose between Yes/No. This way you can add your own custom markers from Media library. Another way to add your custom markers is via Realtyna. This markers can be added on path WPL > Data structure > Listing Types. You will be able to add there your own markers and  assing them to Listing type
      Using Realtyna markers

      Using Realtyna markers

    By Properties map element you will display a map with markers showing all of the estate locations. The information of the location can be added on path  WPL > Add Listing > Adress Map by changing  location of the marker. You can also edit the location of already existing property by going to WPL > Listing Managere > Edit > Adress Map. 

    Setting Location of property

    Setting Location of property

    Properties map

    Properties map

    Properties map

    Properties map Settings

    Properties map Settings

    This element have 2 tabs with option to customise the way how the map will be shown on the site:

    General
    1. Custom map Style – use one of custom maps styles avaliable on Snazzy Maps site (this option is not compatible with Map Type control)
    2. Custom map height – enter map height (in pixels or leave empty for responsive map)
    3. Zoom value – set custom zoom value, eg. 10. Please note the map will automatically expand to show all markers.
    4. Map Type control
      • Theme default
      • Roadmap
      • Satellite
      • Hybrid
      • Terrain
    5. Scale control – choose between Yes/No
    6. Google Maps search control – choose between Yes/No
    7. My position control – choose between Yes/No (Works only with https)
    Icons
    1. Use custom markers for this map –  choose between Yes/No. This way you can add your own custom markers from Media library. Another way to add your custom markers is via Realtyna. This markers can be added on path WPL > Data structure > Listing Types. You will be able to add there your own markers and  assign them to Listing type
      Using Realtyna markers

      Using Realtyna markers

    By Properties map element you will display a map with markers showing all of the estate locations. The information of the location can be added on path  WPL > Add Listing > Adress Map by changing  location of the marker. You can also edit the location of already existing property by going to WPL > Listing Managere > Edit > Adress Map. 

    Setting Locations of property

    Setting Locations of property

    Properties mini listing

    Give you option to show list of properties created in WPL plugin on path WPL > Listing Manager

    Latest listing transparent

    Latest listing transparent

    Properites mini listing settings

    Properites mini listing settings

    This element have 4 tabs with option to customise the way how the list of the properties will be shown:

    General
    1. Title (avaliable for Latest listing and Latest listing transaprent)
    2.  Template
      Property mini listing templates

      Property mini listing templates

      • Mini listing (1)
      • Latest listing (2)
      • Latest listing transparent (3)
    3. View more text – add link that for View more
    4. View more link – add link that for View more
    5. CSS class – add custom css class you want to use to style this element
    Filter Properties
    1. Kind (only avaliable option: Property) 
    2. Listing – choose which listing will be shown
      • All
      • For sale
      • Fo Rent
      • Vacation rental
      • You can add your own custom
    3. Property type – choose visible types
      • All
      • Office
      • Apartment
      • Land
      • Villa
      • You can add your own custom
    4. Listing IDs (Comma Separated) – add which properties will be shown based on the ID
    5. Random – randomize visible list
    6. Only Featured – choose between Yes/No
    7. Only Hot Offer – choose between Yes/No
    8. Only Open House – choose between Yes/No
    9. Only Foreclosure – choose between Yes/No
    Sort and Limit
    1. Order by – give you option to order the list by:
      • Add date
      • Listing ID
      • Built up Area
      • Price
      • Pictures
    2. Order
      • Ascending
      • Descending
    3. Number of properties – set number of visible properties visible on single page
    Buttons
    1. Enabled – choose between Yes/No
    2. Title – button visible inside the button
    3. Link
    4. Size – avaliable 4 button sizes
      • Default
      • Extra small
      • Small
      • Large
    5. Style – avaliable 8 buttons style
      • Estato Default
      • Estato Primary
      • Estato Success
      • Estato Info
      • Estato Warning
      • Estato Danger
      • Estato Dark
      • Estato Link
    6. Transparent Estato Style – choose between Yes/No
    7. Custom CSS class – add custom css class you want to use to style this element

    Properties listing

    Properties listing example

    Properties listing example

    Give you option to show list of properties created in WPL plugin on path WPL > Listing Manager

    Properties listing settings

    Properties listing settings

    This element have 4 tabs with option to customise the way how the list of the properties will be shown:

    General
    1. Title – set title for the list
    2. Type listing view – choose between two views:
      • Grid

        Grid

      • List
        List

        List

    3. CSS Class – add custom css class you want to use to style this element
    4. View more text – change text that will be shown for view more link
    5. View more link – add link that for View more
    6. Columns count in grid view – set number of columns avaliable for grid view
    7. Show additional options
      • Sort options and pagination
      • Sort options
      • Pagination
      • None
    8. Boxes size
      • Big
      • Small
    Filter Properties
    1. Kind (only avaliable option: Property) 
    2. Listing – choose which listing will be shown
    3. Property type – choose visible types
    4. Listing IDs (Comma Separated) – add which properties will be shown based on the ID
    5. Random – randomize visible list
    6. Only Featured – choose between Yes/No
    7. Only Hot Offer – choose between Yes/No
    8. Only Open House – choose between Yes/No
    9. Only Foreclosure – choose between Yes/No
    Sort and Limit
    1. Order by – give you option to order the list by:
      • Add date
      • Listing ID
      • Built up Area
      • Price
      • Pictures
    2. Order
      • Ascending
      • Descending
    3. Number of properties – set number of visible properties visible on single page

    Properties search

    Property search

    Properties search

    With this element used on your site you will be able to search for the estates avaliable on your site. Below you will find information how to customize this elements.

    This element isn’t customizable via Visual composer, all the changes to this element can be added by WPL options that can be found on path Appearance > Theme Settings > Searchbox

    Avaliable search fields

    Avaliable search fields

    For Searchbox you will be able to set:

    1. Title – title visible for your searchbox
    2. Kind – type of item it will be search from
    3. Layout – choose from two of avaliables layouts
      • default
      • simple
    4. Target page – set the target page in which the Search will be looking for the estates
    5. Css Class – you can add custom css class that can be used for adding custom style for this element
    Search Fields configuration

    Search Fields configuration

    After clicking View Fields option in the main section (1) you will see all the fields that will be visible in the Searchbox. To customize the look of this element you can remove (2) already added fields, add new one (3), choose type of data (4) you can use and range of the data (5). At the end when you are happy with all the fields you used you can change order (6).

    All the changes you will made will be saved automatically.

     


    Pages


    You can use Pages to organize and manage any content on your website. You can create multiple pages on your website for different types of content or setup onepager with scroll-to-section menu.


    Create pages Estato WP


    To create a new Page follow the steps below:

    • Step 1 – select Pages > Add New
    • Step 2 – add Title
    • Step 3 – add content – we recommend you to create page content using Visual Composer or by modifying demo content
    • Step 4 – choose page attributes:
      Page attributes

      Page attributes

      • Parent – if you want to create subpage
      • Template – you can choose one of defined page templates:
      • Page order
    • Step 5 – click Publish to make your page public.

    Learn more:

    WordPress Pages


    Homepage setup


    If you have added some pages via Pages > Add new you can choose one and set it up as a homepage. Use Static front page tool in Settings > Reading and choose from the list your homepage. Remember to click Save changes at the end of editing.

    Static front page

    Static front page


    Onepager setup Estato


    REMEMBER: To be able to fully use Onepager Feature you need to check the onepager option in Customize section General

    Estato has the ability to make one page site with a scrolling to sections menu. Most sites are traditionally setup with individual pages, each page with its own content. One page site allows you to put all the content on one page, and the menu items will link to each different section of the page. Think of it as a full site but all on one page. Please read below for information on how to set this up.

    Create A New Page With Your Content And Anchor Points

      • Step 1 – Navigate to the Pages section of your admin and click Add New.
      • Step 2 – Create page with all sections. Each section should begin with [chapter] shortcode or any other html element with unique id, for example :
      • Step 3 – 2. In Appearance > Menus create new main menu (using Custom Links option), where URL will be section id with “/#” sign, for example : /#services or /#about.
    Add new menu item

    Add new menu item

    Menu items

    Item details

    And your onepager menu is ready. Remember to choose Theme Location Primary Navigation to your menu.

    Creating your Onepager Menu you can also use Max Mega Menu plugin to be able to recreate the style of the menu used on Estato WP demo site. More information about this plugin you will find HERE.


    Menu setup


    Depending on which version of content arrangement you choose, you can create onepager or multipage navigation menu.

    To create navigation menu dedicated to multipage websites, please follow the steps below:

    • Step 1 – Navigate to Appearance > Menus
      Menus

      Manage your menus

    • Step 2 – Click on create a new menu, enter menu Name and click on Create Menu button
      Add new menu

      Add new menu

    • Step 3 – From the right side choose pages that you want to add to your menu and click on Add to Menu. Once menu items are added, you can reorder or nest them via drag and drop tool. Remember to click Save Menu when you finish to keep your changes saved.
      Add Page to menu

      Add Page to menu

    • Step 4 – You can easily rename every menu item in item details.
      Rename your menu items

      Rename your menu items

    • Step 5 – Optionally you can add to menu other items, like Links or Categories
    • Step 6 – Check your menu as Main menu to set one of avaliable location.
      Primary navigation

      Primary navigation

      1. Main Menu – will be visible on top of each page
        Main menu Example

        Main menu Example

      2. Mobile menu – this menu will be visible on mobile devices (in Estato this menu is created without MaxMegaMenu plugin)
        Mobile menu example

        Mobile menu example

    • Step 7 (optional) – Enable Max Mega Menu for Theme Location
      Max Mega menu Settings

      Max Mega menu Settings

    • Step 8 – Always click Save Menu after providing any changes

    Menus can be also shown in widgets section of Dasboard. After creating the menu you want to use, go to Appearance > Widgets and set the menu on your site using Custom Menu widget like in the example below.

    Set menu as a widget

    Set menu as a widget

    Menu added to the site via widget

    Menu added to the site via widget


    Blog


    Estato is loaded with options for the blog. It offers many different options for you to present your blog posts, along with several different blog post layouts. In addition, there are numerous theme options and shortcode options that allow you to customize how posts are displayed.

    There are several ways to display your blog posts, we will cover each method as well as describe blog post types, post options and theme options. The following sections will cover each of these aspects of the blog.


    Creating Blog post for Estato


    No matter which method you use to display your blog posts, first thing you need to do is create them.

    Estato offers several blog post types:

    • Standard
    • Aside
    • Image
    • Video
    • Audio
    • Quote
    • Link
    • Gallery
    Post formats

    Post formats

    Follow the steps below to create a blog post

    • Step 1 – navigate to Blog Posts in your WordPress admin.
    • Step 2 – click on Add New to make a new post. Create a title and insert your post content in the editing field. You can use any of our shortcode elements inside the post.
      Add New Post

      Add New Post

      If you want to use some additional fields, choose them from screen options at the top of the screen.

      Screen Options

      Screen Options

    • Step 3 – add Categories from the right side. To assign it to the post, check the box next to the Category name.
    • Step 4 – add Tags from the right side. Type the name of the tag in the field, separate multiple tags with commas.
    • Step 5 – for a single image, click the Featured Image box, select an image and click Set Featured Image.
    • Step 6 – for a Gallery, use Image Gallery (VisualComposer element) , each image will be a slide in the gallery slideshow. Gallery can be created by adding images from Media gallery or by adding Externa links of the images that will be used.
    • Step 7 – for a Video post, use Vide Player (VisualComposer element) and paste the direct video url from Youtube, Vimeo or Dailymotion and more.
    • Step 8 – for Audio post, use Vide Player (VisualComposer element) and paste the direct video url from Soundcloud, Mixcloud and more.
    • Step 9 – for Quote use WordPress Blockquote option (Shift + Alt + Q) 
    • Step 10 – for Link use WordPress Inser/edit link (Ctrl + K) option 
    • Step 11 – create an excerpt – Excerpts are optional hand-crafted summaries of your content that can be used in your theme. Learn more about manual excerpts
      Excerpt

      Excerpt

    • Step 9 – once you finished, click Publish to save the post.

    Blog index page


    The most popular way of displaying blog posts is to setup blog index page. There all of your posts will be displayed and ordered by publish date.
    To set the page as your post page, navigate to Posts page tool in Settings > Reading and choose Blog index page from the ones you created.

    Blog Index page

    Blog Index page

    Notice:
    On Blog index page you will see only your posts, so don’t add any other content to it.


    Faq Page


    FAQ page

    FAQ page

    Frequently Asked Questions (FAQ) of Estato is generated by the theme from Faq items. This type of page can be created by going to Appearance > Customize > Faq and adding there the slug and title the page will use.

    Adding Faq slug and title

    Adding Faq slug and title


    Faq item


    Creating FAQ Item:

    To create new FAQ elements, navigate in WordPress dashboard to FAQ > Add New

    Add new Faq item

    Add new Faq item

    For new FAQ item  you can define:

    1. Title – add FAQ question,
    2. Editior container – add answer for the question,
    3. FAQ Categories (optional) – assign to arleady existing category or add new one.  
    Creating FAQ item

    Creating FAQ item

    Creating FAQ Categories

    Categories are very convenient way to organize your faq items, that can be added to more than just one category.

    To create new FAQ category, navigate in WordPress dashboard to  FAQ > Faq Categories

    Add new Faq Category

    Add new Faq Category

    For new FAQ item  you can define:

    1. Name
    2. Slug

    After every modification click on Update to keep your changes saved.

    FAQ category

    FAQ category


    Portfolio item


    Creating Portfolio Item:

    Portfolio item

    Portfolio item

    To create new Portfolio elements, navigate in WordPress dashboard to Portfolio items > Our projects

    Add New Portfolio item

    Add New Portfolio item

    For new Portfolio item  you can define:

    1. Title,
    2. Editior container (images visible on portfolio item page) – content visible in the Editior container is added with use of Add Media option,
    3. Portfolio Categories (optional)assign to arleady existing category or add new one.  
    4. Tags (optional)
    5. Featured Image (viisble on ‘Our Projects’ page)
    6. Portfolio setings
      • Client
      • Client website
      • Details
      • Start date
      • End date
    7. Multilangual Content Setup – check box to make ‘Portfolio items’ translatable (Avaliable only when WPML plugin is in use)

    After every modification click on Update to keep your changes saved.

    Creating Portfolio Item

    Creating Portfolio Item

    Creating Portfolio Categories

    Categories are very convenient way to organize your porfolio items, that can be added to more than just one category.

    To create new Portfolio category, navigate in WordPress dashboard to  Portfolio items > Portfolio Categories

    Creating new Portfolio Categories

    Creating new Portfolio Categories

    For new FAQ item  you can define:

    1. Name
    2. Slug
    FAQ category

    FAQ category

    After every modification click on Update to keep your changes saved.


    Creating portfolio page


    Portfolio page of Estato is built using Visual Composer. Theme is supporting 3 version of this page:

    • 3 Columns
    • 4 Columns
    • 6 Columns

    The Visual Composer Backend editor of the page look like this:

    Portfolio page in Backend editor

    Portfolio page in Backend editor

    Adding row

    Row Settings: After adding new Row to the page in the General option please change Row stretch option to Stretch row and content as on example below:

    Row Settings - General

    Row Settings – General

    after switching to Design Options Tab set padding and border value for this element and add Background image (optional)

    Row Settings - Design Options

    Row Settings – Design Options

    Content

    1. Text Block – Go to general tab and Add content to the Text tab:
      Text Block settings

      Text Block settings

       

    2. Post Masonry Grid – Set options as below if you wish to recreate the look of ‘our Projects’ from Estato:
      • General 
        General tab

        General tab

        1. Data source – Ct-portfolio (setting this option images will be taken from Portfolio item),
        2. Total items – choose number of elements that will be visible on the site,
        3. Display Style – Show all,
        4. Show filter – Yes
        5. Grid elements per row – choose 3, 4 or 6 Elements per row,
        6. Gap – 30px
        7. Initial loading animation – Default
        8. Extra class name – add ct-vcMasonryGrid–portfolio class to have the same style of the portfolio like on Estato demo
      • Data Settings – no changes added
      • Filter 
        Filter

        Filter

        1. Filter by – Portfolio Categories(ct-portfolio-taxonomy),
        2. Style – Filled
        3. Default title – All,
        4. Alignment – Center,
        5. Color – Sky,
        6. Filter size – Large
      • Item Design 
        Item Design

        Item Design

        1. Grid element template – Masonry grid: Overlay with rotation
      • Design options 
        Design options

        Design options

        1. Css box – margin-bottom: 20px;

    Page Attributes

    To be able to use Customize options dedicated for Portfolio page, please choose Our projects from Template.

    Portfolio template

    Portfolio template


    Contact forms


    Contact forms in Estato are created with the use of Contact Form 7 Plugin. Below you will find information how to recreate Contact forms used in our theme by adding the correct markup for the Form section of this plugin.

    Contact form markup added to Form

    Contact form markup added to Form

    If you never before used this plugin I suggest you to check Getting Started with ContactForm 7.

    Calculate Loan

    This contact form come with two color versions, than can be achieved by adding custom css class to Inner column Settings in VisualComposer when creating page with form:

    Adding custom class

    Adding custom class

    1. Dark version (with custom class ct-contact-claculatorFormContainer)
      Calculator loan dark

      Calculator loan dark

    2. Light version (no custom class)
      Calculator loan light

      Calculator loan light

    Calculator can be recreated by using this markup for contact form:

    Feel Free to Contact Us

    Feel free to contact us

    Feel free to contact us

    To recreate this contact form please use:

     

    Newsletter

    Newsletter form

    Newsletter form

    To recreate this Newsletter form please use:

     

    Newsletter-footer

    This is a contatc form that will let you recived e-mails from user that want to Subscribe your site.

    Footer contact form

    Footer contact form

    To show your contatc form in footer, go to Appearance > Widgets by adn you can add there ContactForm7 shortcode to Text widget

    Adding footer contact form

    Adding footer contact form

    To recreate the look of this contact form please use this markup:

    Send us a Message

    Contact form on map

    Contact form on map

    Markup used for this contact form:

    To display this contact form on a map, you need to create two Rows Like on the image below.

    Creating section

    Creating section

    and add :

      1. ct-contact-map–Container custom class for Google map Row
      2. ct-contact-formContainer ct-contact-multiPage custom class for Contact form Row
    Adding custom CSS class

    Adding custom CSS class

     


    Avaliable Templates


    What are Estato Templates?

    If you are not interested in downloading the whole content via Unyson demo import, but still want to use some of the pages from the demo you can use the VisualComposer Templates option.

    How to use them?

    1. Create new page going to Pages > Add New 
      Add New Page

      Add New Page

    2. Go to Visual Composer Backend Editor and choose Templates option.
      Templates options

      Templates options

    3. Choose from My Template tab one of the templates you want to use and click add template
      Avaliable templates

      Avaliable templates

    4. The Template content will be added to the page. Now you can click Publish and it’s done! Or you can start editing content of your page.

    Avaliables Types

    1. Contatc Us
    2. Home V1 – Portal slider
    3. Home V2 – Portal Map
    4. Home V3 – Portal Map (Light)
    5. Home V4 – Real Estate Agency
    6. Home V5 – Property Slider
    7. Home V6 – Simple Onepager
    8. Home V7 – Onepager Video
    9. Home V8 – Side Map
    10. Privacy Policy
    11. Terms and Conditions

    Template avaliable via slug

    a) Maintenance – can be used by creating empty page with maintance slug


    Creating Agent single page (Agent’s profile)


    On Agent page you can show information about one of your property agents and all estates attached to them with the use of single WPL shortcode.

    Creating Agent profile:

    By default, WordPress users are not WPL users. This provides you better managerial supervision for distinguishing between the agents and the basic users such as subscribers, authors, etc.

    You can activate users in WPL simply by going to WPL > Use Manage and then clicking on the “Tick” or “Plus” icon. For specifying user access and limits you should click on the “Edit” icon, change the settings and save it.

    Activate User in WPL

    Activate User in WPL

    If you don’t know how to create a new WP user account please check this link.

    Each agent has their own profile page and they can edit the information to be shown on the “Agent Activities” or “Listing Details” page. Uploading a profile picture and company logo is highly recommended so it is good to request that your agents upload their pictures.

    Agent's profile settings

    Agent’s profile settings

     

    Do not forget to click on the finalize button after filling the profile page.

     


    Creating Property page


    Property pages created via Estato will give you option to show page containing all the needed information about your property like property description, features, appliances, address map and much more. Below you will find information how you can create this pages on your own.

    Property page Version 2

    Property page Version 2

    Both of Property pages visible on Estato demo (Version 1 and Version 2), can be divided into two Estato elements Single Property and Property mini listing. Here we will concentrate on all the information what option need to be set to recived same look on the page. If you wish to find more information about the Estato shortcodes using information from WPL plugin please check Custom Realtyna shortcode section, where you will find more information about Single Property and Property mini listing elements.

    Property page version 1

    This version contains full width map with the slider of the property’s image and sidebars.

    Version with Sidebar

    Version with Sidebar

    To create this variation of the page follow steps below:

      • Step1: Go to Pages > Add New and create new page and make sure that the Template you are using is Default Template, or use already created page that is using the same Template.
        Page Attributes

        Page Attributes

      • Step2: Create a row section on your page.
        Add Row section

        Add Row section

      • Step2: Add Single Property (1) element to the row and in the Settings options set ID (2) of the property you want to show (where to find ID?)  and choose Full width map as a Property template (3).
      • Adding Single Property

        Adding Single Property

      • Step3 :  Create a second row like before but this time in General tab set Strech row for Row strech (1) option. For Design Options add 40px for top margin (2) and set the Background (3) color to: #f3f3f3
      • Row stretch options

        Row stretch options

        Design Options

        Design Options

      • Step4: Add Properties mini listing element to row. After accessing Properties mini listing Go to the General (1) tab and set Latest listing transparent as a Template (2) for this element. with this Template option you can also add Title (3) that will be visible on the site.
        Add Properties mini listing

        Add Properties mini listing

      • Adding mini listing Settings

        Adding mini listing Settings

    Remember to Update the changes on the page to save them.

    Property page version 2

    Full width map version

    Full width map version

    This version of the property contains full width map with the slider of the property’s image. To create this variation of the page follow steps below:

      • Step1: Go to Pages > Add New and create new page and make sure that the Template you are using is Default Template, or use already created page using the same Template.
        Page Attributes

        Page Attributes

      • Step2: Create a row section on your page.
        Add Row section

        Add Row section

      • Step2: Add Single Property (1) element to the row and in the Settings options set ID (2) of the property you want to show (where to find ID?)  and choose Full width map as a Property template (3).
        Adding Single Property Settings

        Adding Single Property Settings

      • Step3 :  Create a second row like before but this time in General tab set Strech row for Row strech (1) option. For Design Options add 40px for top margin (2) and set the Background (3) color to: #f3f3f3
      • Row stretch options

        Row stretch options

        Design Options

        Design Options

      • Step4: Add Properties mini listing element, to the just created row. After accessing Properties mini listing go to the General (1) tab and set Latest listing transparent  for Template (2) for this element.
        Property mini listing Settings

        Property mini listing Settings

    Remember to Update the changes on the page to save them.


    Where to find ID?

    The ID that can be used for Single Property element can be found in WPL on path WPL > Listing Manager where you will find list of all the estate added to the WPL. After choosing the property you want to show click Edit button After entering Add/Edit Property you will find Listing ID that can be used in the Single Property Element.

    Searching for ID

    Searching for ID

     


    Realtyna WPL Basic – Estato


    What is WPL?

    WPL (WordPress Property Listing) is a great plugin for real estate agents and agencies. It is the most feature-rich, flexible, scalable and extendable WordPress plugin for creating Real Estate websites / portals.

    Estato Compability

    Estato comes with the Realtyna WPL Basic version but the theme is also fully compatible with the WPL Pro version. HERE you can check all the differences betwen WPL Basic and WPL PRO version to decide if you want to use the bundled version or rather buy the Pro version of the plugin.

    Plugin installation

    WPL is one of the requested to insall plugin and it should be installed after you install and activate the Estato – otherwise you might be encountered problems with correct theme functioning. After it installation this plugin will be automatically activated.

    Due to plugin bug it need to be activated individually

    Reinstalling the plugin:

    If you are using multisite or you are having blog on your site and want to reset the site you won’t be able to correctly activate WPL plugin then. To use the plugin again you will need to reinstall the plugin, to do so please go to the plugins folder in your WordPress and remove the plugin folder from there. After doing that you will be able to install and use this plugin again.

    How does the WPL shortcode wizard work?

    WPL has a feature for generating shortcodes automatically based on your configuration. You can find it on the WordPress editor:

    WPL shortcode wizard

    WPL shortcode wizard

    After clicking on the [W] icon, you will see the below wizard:

     

    WPL View options

    WPL View options

    This wizard can generate Property Listing, Property show (single property page), Profile/Agent Listing, Profile/Agent Show, My Profile and the Widget Shortcode (PRO members). You can select one of these shortcodes using the “View” option.

    Configure options

    Configure options

    Each Shortcode (“View” option) has its own configuration form. You can set the configuration form if needed and click on “insert” to see the generated shortcode into your post/page content.

    Add Shortcode to WordPress editor

    Add Shortcode to WordPress editor

    If you are using VisualComposer plugin to use the WPL shortcodes on page, you can add them to the Text block shortcode:

    Visual Composer view

    Visual Composer view

    Available shortcodes

    • Property Listing allows you to show the list of properties to site visitors with pagination, sort options. You can add different types of property listings: a menu for showing sale properties or rental properties, specify the default page size and default sort type, etc
    • Property Show allows you to add property to your site page.
      To check all available listings, please navigate to WPL > Listing Manager page in your admin panel. Click Edit next to the listing you would like to add:

      Edit Properties

      Edit Properties

    • Profile/Agent Listing is used for creating a profile listing view. It is used to list the agents. Enter the following settings to shortcode wizard: Layout, User Type, Target Page, Page Size, Order by and Order settings
    • Profile/Agent Show is used to display the profile of a specific user/agent.
      1. Select Profile/Agent Show from the View drop down.
      2. Set up layout by selecting option from Layout drop down.
      3. On the next step choose user you would like to add to the page.
      4. Select target page for your user link:
      5. My Profile is used to display the profile form of a user/agent in frontend. Select My Profile from the View drop down. Click Insert button. In order to change profile information, open WPL > My Profile page in your WordPress admin panel. Here you can change agent name, upload photo, change contact details.

    Theme Settings


    Theme Settings is an options that will allow you to set basic optins that can be crusial when creating your Estate page. Theme Settings can be found in Dashboard on path Appearance > Theme Settings that contains 2 Tabs:

    1. Pages
        • Agent Profile page – allow you to choose Agent profile page and extra style it with Customise options
        • Agent listing page – allow you to choose Agent listing page and extra style it with Customise options
      Pages options

      Pages options tab

    2. Searchbox – option that will allow you to set the searchbox.
        • Title – set title for the Searchbox
        • Kind – set the kind from the avaliables options
        • Layout – layout type (only simple avaliable)
        • Target page – page where this searchbox will be shown
        • CSS Class – add custom class to style the element
      Searchbox tab

      Searchbox tab


    Using widgets


    (WARNING:The image below is only an example of how the Widget section might look like. Depending on the theme this option’s content might look different.)

    Widgets are small blocks of content, which you can find in theme footer or sidebar. They were originally designed to provide a simple and easy-to-use way of giving design and structure control of the WordPress Theme to the user, which is now available on WordPress Themes to include the header, footer, and elsewhere in the WordPress design and structure. Widgets require no code experience or expertise. They can be added, removed, and rearranged on the WordPress Administration Appearance > Widgets panel.

    Just drag and drop the widgets you want, into the right hand side where your sidebars and footer widgets are listed. Simply drag your widgets over to the sidebar or footer column, and then populate the content.
    There are various fields and settings you can choose for each individual widget and all are self explanatory. You can also use multiple widgets per footer column, just drag and drop them into place. And you can put as many widgets as you want inside sidebar. Once you have finished populating the widgets, always make sure to hit the Save button to save the settings.

    Just drag widget from the left hand side and drop it on the right

    Just drag widget from the left hand side and drop it on the right


    Avaliable Sidebars


    While widget areas typically occur in webpage sidebars, a theme can place widget areas in many places on a page. For example, besides the usual sidebar locations, the Estato theme has a widget area in the footer of every page.

    This is a list of sidebars avaliable for Estato

    1. Primary Sidebar
    2. Page Sidebar
    3. Header left column 1
    4. Header left column 2
    5. Footer column 1
    6. Footer column 2
    7. Footer column 3
    8. Footer column 4
    9. Post Footer column 1
    10. Post Footer column 2
    11. Blog Sidebar 1
    12. Single sidebar 1
    13. Property Show Bottom
    14. Profile Show Top
    15. Property Listing Top
    16. Profile Listing Top
    17. WPL Hidden
    18. Property Listing Bottom
    19. Footer Widgets Area
    20. Max Mega Menu Widgets

    Plugins


    Some functionalities of the Estato are available because of plugins we used to create it. Once Estato is activated in your WordPress admin panel you should see notification about bundled plugins we recommend to install – they are included in Estato package – so you don’t have to do anything more than click install and activate.

    Notice:
    We can’t guarantee Estato’s compatibility with third party plugins. If you want to avoid unexpected bugs and errors use as little plugins as possible.

    Below you will find the list of plugins we recommend you to use with Estato.


    Estato Plugin


    REMEMBER: Plugin must be installed and activated right after you install and activate the Estato WP – otherwise you might be encountered problems with correct theme functioning.

     

    Plugin dedicated for Estato WordPress Theme that will allow you number of custom features like:

    • portfolio items,
    • faq items,
    • testimonials,
    • Estato WP custom VisualComposer shortcodes
    • Estato WP shortcodes for WPL

     


    Unyson plugin


    REMEMBER: Plugin must be installed and activated right after you install and activate the Estato WP – otherwise you might be encountered problems with correct theme functioning.

    Getting started

    Unyson is a framework for WordPress that facilitates development of a theme. This framework was created from the ground up by the team behind ThemeFuse from the desire to empower developers to build outstanding WordPress themes fast and easy. This documentation is heavily modified by createIT to ensure all custom extensions are well documented.

    This documentation assumes you have a working knowledge of WordPress. If you haven’t, please start by reading WordPress Documentation.

    Minimum Requirements
    • WordPress 4.0 or greater
    • PHP version 5.2.4 or greater
    • MySQL version 5.0 or greater

    Installation

    Unyson is included in Estato package – so you don’t have to do anything more than click install and activate.

    You can also install the plugin manually:

    1. Upload the unyson folder to the /wp-content/plugins/ directory
    2. Activate the Unyson plugin through the ‘Plugins’ menu
    3. Configure the plugin by going to the Unyson menu and activating the following extensions:
      • Custom options type
      • Estato FAQ
      • Estato Portfolio
      • Visual Composer
      • Estato Testimonials
      • Estato Plugin
      Unysone Extensions

      Unyson Extensions

    License

    The licenses for most software are designed to take away your freedom to share and change it. By contrast, the GNU General Public License is intended to guarantee your freedom to share and change free software. Unyson inherits the General Public License (GPL) from WordPress.

     


    Visual Composer


    REMEMBER: Plugin must be installed and activated right after you install and activate the Estato WP – otherwise you might be encountered problems with correct theme functioning.

     

    Estato can be easily customized with Visual Composer.

    Simply drag and drop elements to build your page content. We prepared components which will help you determine main structure of the webpage – easily set up backgrounds, colors and styles for whole sections as well as lots of various smaller components which you can freely put wherever you want.

    How to start?

    We recommend you to use row as essential element of page structure.

    Row

    Row

    You can edit following row attributes:

    Click pen to open edition tools

    Click pen to open edition tools

    1. Row stretch:
        • Default
        • Strech row
        • Strech row and content
        • Strech row and content (no paddings)
    2. Column gap
    3. Header alignment
    4. Full height row?
    5. Equal height
    6. Contet position – the position can be set to Default, Top, Middle and Bottom
    7. Use Video background – use YT video as a background of this section
    8. Parallax – use Parallax as a background
    9. Css Animation
    10. Row ID –  if you want to use section for scroll-to-section navigation
    11. Disable row – if checked the row won’t be visible on the public side of your website.
    12. Extra class name – add extra class name for
    13. Add row target button – this button will points to section of the page using the same ID (?)
    14. Adds target for button – set the ID (?)
    15. Text for target button – Set text that will be visible in the buton (?)
    16. Show in side-navigation? (?)
    17. Title for side-navigation (?)

    Once your section row is created you can choose number of columns in section, their width and optionally offset value.

    Section grid

    Section grid


    Learn more:

    For more information about Visual Composer, please check articles below:
    How to install Visual Composer
    Visual Composer demo
    Visual Documentation


    Max Mega Menu


    Enabling Max Mega Menu for Theme Location

    Estato navigation menu can be built with Max Mega Menu plugin, which allows you to create expanded Mega Menu.

    Once plugin is activated, you can go to the Appearance > Menus > Create a New Menu or used one created before.

    On the left hand you should see a Max Mega Menu Settings box like the one below. Check the “Enable” checkbox and choose from the Theme option  “EstatoStyle” and click Save, your menu will now be converted into a Mega Menu for the relevant Theme Location and will be using style dedicated for Estato

    (WARNING:The image below is only an example of the options used for Max Mega Menu. Depending on the theme, they can be different.)

     

    Max Mega menu Settings

    Max Mega menu Settings

    The basic setup for Max Mega Menu has been completed!!

    If you are looking for more information about using Max Mega Menu plugin please go to the official Max Mega Menu Documentation site.

     


    Revolutions Slider


    Estato is fully compatible with Revolution slider version that comes with Theme package avaliable on Envato Market

    Revolution Slider example

    Revolution Slider example

    How to install plugin?

    Revolution Slider is included in Estato package – so you don’t have to do anything more than click install and activate.

    Creating a new Slider

    Information hot to create custom Slider can be find in Plugin Documentation.

    Common questions:

    How to update the plugin when it was packaged with your theme? 

    Purchase Code isn’t working


    Elite Author
    We are elite
    CreateIT
    Who we are

    Hi, we are createIT. We create IT. Web applications and websites to be precise.

    And we are REALLY good at it.

    Get to know us at www.createIT.pl
    Thanks for buying!