Idyllic Free

Theme Documentation

Please Rate Us For Idyllic Theme

Thank you very much for choosing our Theme.
If you like this Theme, Please (Rate Us)

Idyllic Demo Setup


Installation

Step 1 WordPress installation

To install this theme, you must have a working version of WordPress already installed on your server. WordPress is well-known for its ease of installation.
https://codex.wordpress.org/Installing.WordPress. Please visit this link for installing WordPress.

Step 2 Installation Through Dashboard (Easy)

  1. Log in to the WordPress Dashboard.
  2. Go to Appearance->Themes.
  3. Click on Add New Button.
  4. Search Idyllic
  5. Click on Install tab and Activate it
  6. Now your Idyllic theme is ready to Use

Step 3 Manual Installation using FTP (Advanced)

  • First download a zip file from https://wordpress.org/themes/idyllic/ .
  • Unzip idyllic.zip file at your PC.
  • Access your host web server using your favorite FTP client (such as Cyberduck or FileZilla etc).
  • Upload whole folder inside public_html/wp-content/themes/idyllic(folder) and Do not change directory/folder name.
  • Log into your WP admin paneland click on the Appearance->Theme tab.Now click on the Idyllic theme to activate it.

Header Setup

Step 1 Upload Logo/ Fav Icon/ Web Icon

Go to Dashboard > Appearance > Customize > WordPress Settings > Site Title & Logo Options > Upload Site Icon & Site Logo

Step 2 Setup Menu

  1. Go To Apperance > Menu
  2. Create a new menu by clicking on create a new menu
  3. Add your menu items as pages/ Category/ Custom Url in left side menu
  4. Choose “Main Menu” from below Checkbox

Step 3 Setup Social Icons

  1. Go To Apperance > Menu
  2. Create a new menu by clicking on create a new menu
  3. Add your menu items as Custom Url in left side menu
  4. Choose “Add Social Icons Only” from below Checkbox

Social Icons

Step 4 Setup Top Information at Header or Footer Widgets

Go to Dashboard > Appearance > Widgets > Drag Text Widget/ Custom HTML at Top Header Info/ Footer Column 4 Sidebar

Top Header Info

paste Below html Code and change according to your needs

<ul>
<li><a title="Call Us" href="tel:+1234567890"><i class="fa fa-phone-square"></i> (123) 456-7890</a></li>
<li><a title="Mail Us" href="mailto:[email protected]"><i class="fa fa-envelope-o"></i> [email protected]</a></li>
</ul>

Importing the Demo Content

Note: This Demo Importer plugins is only for Free users. If you are using free themes then download importer plugins from free instruction page. So we recommended to use free demo importer for free users and Plus demo importer for plus users. Also this importer plugin is for fresh themes who doesnot have anything to loose from their website. If you have existing site then don’t use this plugins to import dummy content

  1. Install WooCommerce Plugins and Contact Form 7 Plugins to look exactly as in our demo
  2. Download Theme Freesia Demo Import and install it as a plugin
  3. Click on Dashboard > Appearance > Import Demo Data
  4. Click on Import Demo Data

Once you have imported the demo content delete One Click demo Import plugin

Setup Frontpage/ Blog as in Demo using Corporate Template

  1. Go to Dashboard > Pages > Add new
  2. Create Home & Blog Page
  3. choose Idyllic Corporate Template from Template drop down like as shown in screenshot.

Corporate Image

  1. Click Save it
  2. Go to Settings > Reading and select Front page displays > A static page (select “Home”) & Posts page ( “Blog”)

Home Page Setting

Setup Our Features

Create a feature page from Dashboard > Pages > Add New Add Title, Content & Featured Image
After creating pages Go to Dashboard > Appearance > Customize > Frontpage Template > Frontpage Features Section > Select Feature page just now you have created

Setup Other Section of Frontpage using Corporate Template

Go to Dashboard > Appearance > Customize > Idyllic Frontpage Template > and add About Us Section, Fact Figure Box Section, Front Page Features Section, Latest from Blog Section, Portfolio Section, Our Team Member Section, Our Testimonial Section and also you can change the position of these section

Front Page Template Section

front page features

Our Team Member

paste Below html Code in your page editor to display as in our demo site which helps you to add social icons

<ul class="social-links">
<li><a title="facebook" href="facebook.com"></a></li>
<li><a title="twitter" href="twitter.com"></a></li>
<li><a title="googleplus" href="plus.google.com"></a></li>
<li><a title="pinterest" href="pinterest.com"></a></li>
<li><a title="dribbble" href="dribbble.com"></a></li>
<li><a title="instagram" href="instagram.com"></a></li>
<li><a title="flickr" href="flickr.com"></a></li>
<li><a title="linkedin" href="linkedin.com"></a></li>
</ul>

Custom CSS

You can add your custom CSS that will overwrite the theme CSS. Go to dashboard >appearance > Customize > Additional CSS

Setup Slider

  1. Create Category > Make your Post and select category just you created.
  2. Add featured Image, Title and Content
  3. To display Slider Go to Dashboard > Appearance > Customize > Idyllic Slider Options > Select Category Slider

Slider Settings

  1. To display Slider Go to Dashboard > Appearance > Customize > Idyllic Slider Options > Slider Settings
  2. To enable slider, select Frontpage or Entire Site option under Enable Slider
  3. Click on Save & Publish

slider settings

Layout Options

  1. Go to Dashboard > Appearance > Customize > Idyllic Theme Options > Layout Options
  2. Multi Header Design Layout
  3. Blog Content Display
  4. Select responsive layout on/off
  5. Select Blog Image display layout to view in large or medium image display
  6. Disable Entry Format from Blog Page
  7. Disable Entry meta from Single Page
  8. Set your design layout as fullwidth or boxed or small boxed layout

Theme Options

  1. Go to Dashboard > Appearance > Customize > Idyllic Theme Options > Idyllic Options
  2. Disable Slider Button
  3. Disable Search Form
  4. Disable Side Menu
  5. Disable Stick Menu
  6. Disable Goto Top
  7. Disable Top Social Icons
  8. Disable Side Menu Social Icons
  9. Disable Bottom Social Icons
  10. Disable WOW Effect
  11. Disable Page/Single Featured Image
  12. Display full width feature image in single post
  13. Disable Main Menu
  14. Reset all default settings. (Refresh it to view the effect)
  15. Click on Save & Publish

Footer Background Image

  1. Go to Dashboard > Appearance > Customize > Idyllic Theme Options > Footer Background Image
  2. Upoad it
  3. Click on Save & Publish

Idyllic Theme Options

Set Contact page

  1. Go to Dashboard > pages > Add New
  2. Add shortcode in page editor
  3. Select Contact Template from rightside of the page
  4. Click on Update/Publish

To add Google Iframe Code to display as in demo

Go to Dashboard > Appearance > Widgets > Drag Text/ Custom HTML Widget to > Iframe Code For Google Maps sidebar & Add iframe code

 

Iframe Code For Google Maps

 

To add Contact Information at sidebar
Go to Dashboard > Appearance > Widgets > Drag Text Widget > Contact page sidebar & fill the contact information

Recommended Plugins

  1. Jetpack for Gallery & many more
  2. Regenerate Thumbnails for Regenerating Thumbnails
  3. Contact Form 7 for Contact Us page
  4. WP-PageNavi for Numeric Pagination
  5. Polylang for multilanguage
  6. bbPress for Support Forum
  7. Breadcrumb NavXT
  8. wooCommerce for your Shopping Site
  9. Recent Posts Widget With Thumbnails for thumbnail post to display on widgets

Download Idyllic Child Theme

Child theme is very important. Child themes are often used when you want to customize or tweak an existing WordPress theme without losing the ability to upgrade that theme
Download Now!