Theme Files

Check file integrity

Installing Theme

DreamHome Premium theme can be installed as a normal WordPress theme would. It is can be installed via WordPress Theme Uploader or via FTP method.
Installing via WordPress Uploader
Installing via FTP
Activate DreamHome after successfully uploading the file into the server.
Activating Theme

Installing Extra Plugins

Steps for Installing the plugins dependencies needed for the theme to work properly.
Installing Plugin
Installation Form
Installation Process
Dependencies Plugins List
These plugin is required by the theme to work properly and it will be automatically installed and enabled when the theme is enabled.
Plugin Name Description
VicTheme Core The core plugin to provide the theme with VTCore Systems and HTML object classes.
VicTheme Headline Plugin for providing theme with headline elements, metabox and templating
Visual Composer Provides GUI for layouting and shortcodes
VicTheme Property Plugin for providing theme with property post type, widgets for property contents, shortcode for property contents and integration to visual composer elements.
VicTheme Agents Plugin for providing theme with multiple user as agents for property, widgets for agents contents, shortcode for agents contents and integration to visual composer elements.
Victheme Maps Plugin for providing theme with Google maps element, widgets for displaying maps, shortcode for building maps and integration to visual composer elements
Victheme Visual Bootstrap Plugin for linking visual composer with Bootstrap shortcodes provided by VicTheme Core
Victheme Visual Candy Plugin for linking visual composer with additional shortcodes provided by VicTheme Core
Victheme Visual Plus Plugin for providing visual composer with additional features such as advanced background selector for image, gradient and video
Revolution Slider Plugin for providing revolution slider element to the theme and visual composer
Display Widgets Plugin for controlling widget visibility in different pages
Easy Theme and Plugin Upgrade Plugin for easily upgrading theme from a zip file without the need to delete the old version manually first.
Contact Form 7 Plugin for providing theme and visual composer with configurable contact form.
Breadcrumb Navigation Plugin for providing theme with configurable breadcrumb element.
Image Widget Plugin for providing theme with widget for displaying image from WordPress Media Library
Popular Post Widget Plugin for providing theme with widget displaying popular post entry.
Recent Posts Widget Plugin for providing theme with a better recent post widget than the default WordPress provides.

Importing Dummy Data

Importing demo content is only recommended to be performed in a brand new Wordpress installation. Importing on site with existing content and data can overwrite the old data.
Importing demo content

This import process will attempt to import and recreate the data as the demo site as close as possible.

Removing demo content
The undo process will remove all the mapped content that is created during importation, any recent changes to the imported content will be removed as well.

General Options

This section in the general options configuration form will allow you to customize the theme logo portion.
Logo Configuration

The logo element can contain image, heading text and slogan text. If you only want to have image as the logo, leave the text and slogan field empty.

This section in the general options configuration form will allow you to upload custom favicon image.
Favicon Element
This section in the general options configuration form will allow you customize the menu elements.
Menu Options
This section in the general options configuration form will allow you to customize or disable the initial page loading animation.
Page Loading Animation
This section in the general options configuration form will allow you to upload custom favicon image.
Favicon Element
This section in the general options configuration form will allow you customize the theme integration for dsIDXpress plugin. The options will only visible when the plugin is installed and activated.
DsIDXpress Plugin Integration
This section in the general options configuration form will allow you disable or enable the jQuery JvFloat plugin. By enabling JvFloat plugin all textfield, textarea and select box will use their assigned label element entry as the placeholder text and hide the label element when no value entered / selected to the form input element.
JvFloat Integration
This section in the general options configuration form will allow you configure the Archives page, which includes the blog archives page, search archives page, category archives page and tags archives page.
JvFloat Integration
This section in the general options configuration form will allow you configure the Property single page's property listing elements.
Property Page
This section in the general options configuration form will allow you configure the Agents profile page's property listing by agents elements.
Agents Page
This section in the general options configuration form will allow you enable or disable theme elements visibility.
Element Visibility
This section in the general options configuration form will allow you to customize footer elements.
Footer Element
This section in the general options configuration form will allow you to customize the page not found element.
Page Not Found Options

Layout Options

This section in the layout options configuration form will allow you to customize the page layout style and size
Page Layout
This section in the layout options configuration form will allow you to customize the sidebar locations
Sidebar Position

This section in the layout options configuration form will allow you to the configure the position of sidebar element in different places

The settings will be honoured only with some the theme template, if the page is created using visual composer + visual composer template then the settings configured here will be ignored.

The sidebar will only visible if there are actually widgets inside them, a blank sidebar won't be displayed and the theme will make the content area beside the sidebar to use full width instead.

This section in the layout options configuration form will allow you to customize theme top headers bootstrap columns size
Top Header Column Grids

The grid setting here will be applied to the #top-header children which includes the Top Header Right and the Top Header Left Region.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The total grid for each responsive level must not exceed 12. eg. for Logo Mobile column = 3 then the Navigation Mobile column size must not exceed 9 column

This section in the layout options configuration form will allow you to customize theme headers bootstrap columns size
Header Column Grids

The grid setting here will be applied to the #header children which includes the Logo Region and the Navigation Region.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The total grid for each responsive level must not exceed 12. eg. for Logo Mobile column = 3 then the Navigation Mobile column size must not exceed 9 column

This section in the layout options configuration form will allow you to customize theme headline bootstrap columns size
Headline Column Grids

The grid setting here will be applied to the #headline children headline region

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The total grid for each responsive level must not exceed 12. eg. for Logo Mobile column = 3 then the Navigation Mobile column size must not exceed 9 column

This section in the layout options configuration form will allow you to customize theme slider bootstrap columns size
Slider Column Grids

The grid setting here will be applied to the #slider.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The Slider only has 1 region (slider region), thus by default it is set to 12 column, you can choose to "hide" the slider by setting the column to 0. eg. to hide the slider under mobile phone you can set the column for Mobile device to 0.

This section in the layout options configuration form will allow you to customize theme preface bootstrap columns size
Preface Column Grids

The grid setting here will be applied to the #preface children which includes the Preface One, Preface Two and the Preface Three.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The total grid for each responsive level must not exceed 12. eg. for Logo Mobile column = 3 then the Navigation Mobile column size must not exceed 9 column

This section in the layout options configuration form will allow you to customize theme content top bootstrap columns size
Content Top Column Grids

The grid setting here will be applied to the #content-top children which includes the Content Top Region.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The total grid for each responsive level must not exceed 12. eg. for Logo Mobile column = 3 then the Navigation Mobile column size must not exceed 9 column

This section in the layout options configuration form will allow you to customize theme main content bootstrap columns size
Main Content Grids

The grid setting here will be applied to the #maincontent which includes the Content Region and Sidebar Region.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The Content region will try to detect if it will be rendered alongside the sidebar region or not and if it is rendered not along side the sidebar region then it will fallback to 12 column size automatically. Sidebar may not present in case of :

  1. No active widget placed in the sidebar region
  2. User configured not to display the sidebar under certain page
This section in the layout options configuration form will allow you to customize theme content bottom bootstrap columns size
Content Bottom Column Grids

The grid setting here will be applied to the #content-bottom children which includes the Content Bottom Region.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The total grid for each responsive level must not exceed 12. eg. for Logo Mobile column = 3 then the Navigation Mobile column size must not exceed 9 column

This section in the layout options configuration form will allow you to customize theme postface bootstrap columns size
Postface Bottom Column Grids

The grid setting here will be applied to the #postface children which includes the Postface One Region, Postface Two Region and Postface Three Region.

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

The total grid for each responsive level must not exceed 12. eg. for Logo Mobile column = 3 then the Navigation Mobile column size must not exceed 9 column

This section in the layout options configuration form will allow you to customize theme footer bootstrap columns size
Footer Grids

The grid setting here will be applied to the #footer which includes the First Footer, Second Footer, Third Footer and Fourth Footer

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

Full Footer Grids

The grid setting here will be applied to the #footer which includes the Copyright Region

The grid settings will follow the Bootstrap grid rules as specified in the Bootstrap Grid System Rules.

To disable the copyright region completely you will need to use the General options and uncheck the visibility status it.

Style Options

Color schema is a set of predefined CSS color styles and font styling that the theme provides, it is useful for user to change the theme color and styling easily by just selecting one of the pre-defined color schema.
Color Schemas
Using this section of the theme options, you can customize all the registered color schema values that will be applied to certain parts of the theme. For the remaining part that is not registered to color schema, you must code in the additional CSS for them.
Customize Schema

Custom CSS

The theme provides an easy way for user to input their custom css code via the Custom CSS GUI, the GUI menu entry of "Custom CSS" is found under the Wordpress Appearance menu.
Custom CSS via GUI
You can also define custom css in a file and use the theme css autoloader system to autoload the custom css file.
Custom CSS via File

Visual Composer

If you need to change the default configuration, eg. Allowing more content type that can use Visual Composer, You can visit the Visual Composer configuration page.
Configuring Visual Composer
Visual Composer has 2 kind of edit mode, The Backend Editor and The Frontend Editor. Although both mode is supported by this theme, it is recommended to use the backend mode for reordering complex element.
Editing via Visual Composer

Shortcodes

VicTheme Core plugin provides all the shortcodes listed in this page, Integration to Visual Composer is performed by VicTheme Visual Candy and VicTheme Visual Bootstrap plugins.

Some Shortcodes will requires additional plugin for it to work properly. The plugins required will always included in the bundled plugin.

Bootstrap Alert Element
[bsalert alert_type="success|info|warning|danger"
         button="false|html entity for button text"
         id="some-id"
         class="someclass"]

The label text

[/bsalert]
Attributes Value Description
alert_type success, info, warning, danger The alert type color set as per bootstrap alert type color class
button false or text or html entity The dismissisable button
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Badge
[bsbadge id="some-id"
         cass="someclass"]

The label text

[/bsbadge]
Attributes Value Description
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Column
[bscolumn tag="div or other valid html tags"
        columns_mobile="X" columns_tablet="X" columns_small="X" columns_large="X"
        offset_mobile="X" offset_tablet="X" offset_small="X" offset_large="X"
        push_mobile="X" push_tablet="X" push_small="X" push_large="X"
        pull_mobile="X" pull_tablet="X" pull_small="X" pull_large="X"]

 Content or shortcodes.
 
 [/bscolumn]      
Attributes Value Description
tag valid html tag, default to div HTML tags for wrapping the element.
mobile 1 - 12 Column size for class col-xs-*
tablet 1 - 12 Column size for class col-sm-*
small 1 - 12 Column size for class col-md-*
large 1 - 12 Column size for class col-lg-*
mobile_offset 1 - 12 Column size for class col-xs-offset-*
tablet_offset 1 - 12 Column size for class col-sm-offset-*
small_offset 1 - 12 Column size for class col-md-offset-*
large_offset 1 - 12 Column size for class col-lg-offset-*
mobile_push 1 - 12 Column size for class col-xs-push-*
tablet_push 1 - 12 Column size for class col-sm-push-*
small_push 1 - 12 Column size for class col-md-push-*
large_push 1 - 12 Column size for class col-lg-push-*
mobile_pull 1 - 12 Column size for class col-xs-pull-*
tablet_pull 1 - 12 Column size for class col-sm-pull-*
small_pull 1 - 12 Column size for class col-md-pull-*
large_pull 1 - 12 Column size for class col-lg-pull-*
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Glyphicon
[bsglyphicon icon="icon"]
Attributes Value Description
icon valid bootstrap glyph icon name glyphicon icon name without the icon- preffix
Bootstrap Header Element
[bsheader
       tag="h1-h6"
       small="some text displayed as small text"
       id="some-id"
       class="someclass"]

The main title text

[/bsheader]
Attributes Value Description
tag h1 - h6 The heading text html tags
small text The small text after the main heading
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Jumbotron Element
[bsjumbotron
        fullsize="true|false"
        id="some-id"
        class="someclass"]

some content can be inserted here

[/bsjumbotron]
Attributes Value Description
fullsize true or false toggle to show the jumbotron element in full size or normal size
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Label Element
[bslabel
  label="default|primary|success|info|warning|danger"
  id="some-id"
  class="someclass"]

The label text

[/bslabel]
Attributes Value Description
label success, info, warning, danger, default, primary The label color set as per bootstrap alert type color class
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap List Group Element
[bslistgroup
    id="some-id"
    class="someclass"
    mode="ul|div"
]

  [bslistobject
    type="li|a"
    active="true|false"
    mode="success|warning|info|danger"
    badge="some badge text"
    heading="some heading text"
    href="the url to link this object"]
    
    some content
  
  [/bslistobject]
 
[/bslistgroup]
Attributes Value Description
mode ul|div
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap List Object Element
[bslistobject
  type="li|a"
  active="true|false"
  mode="success|warning|info|danger"
  badge="some badge text"
  heading="some heading text"
  href="the url to link this object"]
 
  somecontent
 
[/bslistobject]
Attributes Value Description
type li or a the type must follow the parent listgroup mode
mode success, info, warning, danger The color set as per bootstrap color class
active true or false Set this to active state
badge text the text will tranformed into bootstrap badge element
heading text the text for the list heading
href valid url link the object to the url
Bootstrap MediaList Element
[bsmedialist
    id="some-id"
    class="someclass"]

  [bsmediaobject type="li" img="x" text="some header text"]somecontent[/bsmediaobject]
  [bsmediaobject type="li" img="x" text="some header text"]somecontent[/bsmediaobject]
  [bsmediaobject type="li" img="x" text="some header text"]somecontent[/bsmediaobject]

[/bsmedialist]
Attributes Value Description
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap MediaObject Element
[bsmediaobject
    type="li|div"
    text="content text heading"
    pull="left|right"
    img="WP attachment image id or image src url"
    id="some-id"
    class="someclass"]
 
Some contents, other shortcode will be processed automatically
 
[/bsmediaobject]   
Attributes Value Description
type li or div use li if this shortcode is wrapped within the bsmedialist
text string of text string of text for the content heading
pull left or right the image alignment to the left or right of content
img url to image or wordpress attachment id the image source
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Panel Element
[bspanel
    heading="text to serve as the panel heading"
    id="some-id"
    class="someclass"]

Some contents, other shortcode will be processed
automatically.

[/bspanel]
Attributes Value Description
heading string of text text to be served as the panel heading
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Row Element
[bsrow tag="div or other valid html tag" 
       id="some-id" 
       class="someclass" 
       data-something="something"]
 
 some content, preferably the [column] shortcode

[/bsrow]
Attributes Value Description
tag valid html tag the html tag used for wrapping this element
data-* string value this will create a html5 data-* attributes
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Bootstrap Well Element
[bswell size="small|normal|large"
        id="some-id"
        class="someclass"]

some content can be inserted here

[/bswell]
Attributes Value Description
size small or normal or large the size for the well element
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Fontawesome
[fontawesome
    id="some-id"
    class="someclass"
    font="fontsize-in-px-or-em"
    icon="fontawesome-icon-name"
    border="boolean"
    spin="boolean"
    flip="horizontal|vertical"
    shape="custom-wrapper-shape"
    position="left|right|center"
    color="hex-color-for-icon"
    border_color="hex-color-for-border"
    background="hex-color-for-background"
    size="fa-font-size eg lg|2x|3x|4x|5x"
    rotate="90|180|270"
    padding="padding in pixel"
    margin="margin in pixel"
 ]
Attributes Value Description
font font size in px or em Manual overriding the icon size by specifying the font size in pixel or em.
icon fontawesome icon name Specify the fontawesome icon name without the fa- prefix.
border true or false Turn on or off the border in the font wrapper element
spin true or false Turn on or off the CSS3 rotate options for the icon
flip horizontal or vertical Flip the font vertically or horizontally
shape circle or diamond Shape for the font icon wrapper
position left or right or center the icon position relative to parent, left and right will float the element while center will assume 100% width and centers the icon
color CSS color hex value Color value for the icon element
border_color CSS color hex value Color value for the icon border element
background_color CSS color hex value Color value for the icon background element
size lg or 2x or 3x or 4x predefined icon size, this will be overriden if font tag is specified.
rotate 90 or 180 or 270 rotate the icon element using CSS3 transformation
padding css padding rule give padding to the font element. example : 10px 10px 10px 10px
margin css margin rule give margin to the icon element. example : 0px 10px 0px 10px
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
jQuery Flip Countdown Element
[jqflipcountdown
   showhour="true|false"
   showminute="true|false"
   showsecond="true|false"
   am="true|false"
   tzoneoffset="numeric"
   speedflip="numeric"
   period="numeric"
   autoupdate="true|false"
   startdate="yyyy-mm-ddThh:ss"
   size="xs|sm|md|lg"
]

Attributes Value Description
showhour true or false Show or hide the hour element
showminute true or false Show or hide the minute element
showsecond true or false Show or hide the second element
am true or false format the countdown in 12 hour format (am = true) or 24 hour format
tzoneoffset numeric set the timezone offset number. example GMT +3 = 3
speedflip numeric in miliseconds the flipping animation speed
period numeric in miliseconds Flipping timer delay before recalculating
startdate date in the format of yyyy-mm-ddThh:ss the starting time for the flipping
size xs|sm|md|lg the size of the flipping element
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
jQuery Flipster Element
 [jqflipster
   class="some class"
   id="someid"
   categories="true|false"
   style="carousel|cover"
   start="delta|center"
   enablekeyboard="true|false"
   enablemousewheel="true|false"
   enabletouch="true|false"
   enablenav="true|false"
   enablenavbuttons="true|false"
]

   [jqflipcontent
     links="Link URL"
     image="image src url|attachment id"
     caption="String forcaption text"
     category="String for category"
   ]


[/jqflipster]
Attributes Value Description
categories true or false build or not to build the categorized links
style carousel or cover choose between carousel mode or coverflow mode
start numeric or "center" string choose the children to be the starting element, "center" will auto detect the center of the element or use numeric value to manually choose the starting center of the element
enablekeyboard true or false enable navigation by keyboard arrows
enabletouch true or false enable navigation by dragging on tablet
enablenav true or false enable navigation dots
enablenavbuttons true or false enable navigation arrows
enablekeyboard true or false enable navigation by keyboard arrows
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
jQuery Flipster Content
[jqflipcontent
    links="Link URL"
    image="image src url|attachment id"
    caption="String forcaption text"
    category="String for category"
]
Attributes Value Description
links valid url string url to link the content to
image image source url or wordpress image attachment id the source of the content image
caption string of text the caption for the image content
category string of text the category for this content, this will be grouped and used to group the content if the parent element has categories attributes enabled.
jQuery Dial (Knobs) Element
 [jqknob
   width="xxxpx"
   displayinput="true|false"
   value="numeric"
   cursor="true|gauge"
   thickness="0.x"
   fgcolor="#xxxxxx"
   displayprevious="true|false"
   angleoffset="0 - 360"
   linecap="butt|round"
   anglearc="0 - 360"
   step="numeric"
   min="numeric"
   max="numeric"
   readonly="true|false"
   inputcolor="text color"
]
Attributes Value Description
width numeric plus px eg. 100px the total width of the knob element in pixels
displayInput true or false display or hide the input elements
value numeric the actual value for the dial
cursor numeric or string "gauge" display mode "cursor", cursor size could be changed passing a numeric value to the option, default width is used when passing boolean value "true" | default=gauge.
thickness 0.1 - 1 the dial thickness as 1 is the thickest and 0.1 is the thinnest
fgcolor CSS Hex color value the dial color
displayprevious true or false display the previous value, only applicable if read only is set to false
angleoffset 0 - 360 starting angle in degrees | default=0.
linecap butt or round gauge stroke endings.
anglearc 0 - 360 arc size in degrees | default=360
step numeric step size
max numeric maximum value
min numeric minimum value
readonly true or false disable changing value
jQuery Shuffled Letters
[jqshuffleletter
   step="x"
   fps="x"]

  The shuffled text

[/jqshuffleletter]
Attributes Value Description
step numeric the animation steps in miliseconds
fps numeric the frame per seconds for animation
Slick Carousel Element
 [wpcarousel
   class="someclass"
   id="someid"
   accessibility="true|false"
   autoplay="true|false"
   arrows="true|false"
   centermode="true|false"
   draggable="true|false"
   fade="true|false"
   pauseonhover="true|false"
   infinite="true|false"
   swipe="true|false"
   touchmove="true|false"
   vertical="true|false"
   cssease="ease|ease-in|ease-out|ease-in-out"
   easing="swing|easeInQuad|easeOutQuad|easeInOutQuad|easeInCubic|easeOutCubic|easeInOutCubic|..."
   lazyload="ondemand|progressive"
   autoplayspeed="Number in miliseconds"
   centerpadding="xxpx"
   slidestoshow="number"
   slidestoscroll="number"
   speed="number in miliseconds"
   touchthreshold="number"
 ]
     
   // For generic content
   [wpcarouselcontent]
     Some content here additional shortcodes is allowed
   [/wpcarouselcontent]

   // For testimonial
   [wptestimonial
     image="wp attachment id"
     name="string for name"
     position="string for position"]
       Some content for testimonial, additional shortcode inside this tag is allowed
   [/wptestimonial]

   // For client logo
   [wpclientlogo
     image="wp media attachment id"
     href="the url to link the image to"
   ]

[/wpcarousel]
Attributes Value Description
autoplay true or false enable or disable the autoscrolling feature
arrows true or false display or hide the navigation arrow
centermode true or false enable the center is larger than other mode
draggable true or false mouse drag to scroll content
fade true or false use fading instead of sliding for animation
pauseonhover true or false pause the scrolling on mouse hover
infinite true or false infinite scroll mode, scrolling without ending
swipe true or false swipe move to scroll the content
touchmove true or false touch to scroll the content
vertical true or false enable or disable the vertical scrolling mode
cssease ease or ease-in or ease-out or ease-in-out CSS3 Easing value
easing valid jQuery easing value define custom easing value for scrolling animation
lazyload ondemand or progressive lazy loading images
autoplayspeed number in miliseconds the autoplay pause time before scrolling again
centerpadding number + px example: 20px the padding size for the centered element
slidetoshow number the maximum number of slide to show at once in the frame
slidetoscroll number the number of slide to move on sliding action
speed number in miliseconds the sliding speed in miliseconds
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Slick Carousel Generic Content
[wpcarouselcontent]
   Some content here, additional shortcodes will be processed automatically.
[/wpcarouselcontent]
Slick Carousel Single Image Content
[wpcarouselimage
   image="wp media attachment id"
   href="the url to link the image to"
]
Attributes Value Description
image Wordpress attachment id the image source for the carousel content.
href valid url the url to link the imate to.
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Slick Carousel Testimonial Content
[wptestimonial
   image="wp attachment id"
   name="string for name"
   position="string for position"]
     Some content for testimonial, additional shortcode inside this tag is allowed
[/wptestimonial]

Attributes Value Description
image Wordpress attachment id the image source for the carousel content.
name string the testimonee name
position string the testimonee job position
id valid css id optional css id
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Contact Information
[wpcontactinfo
   class="someclass"
   id="someid"
   icon="Valid fontawesome icon class name without fa- prefix"
   label="String for contact label"
   separator="String for separator"
   text="String for contact text"
]
Attributes Value Description
icon valid fontawesome class without fa- prefix The icon on the side of the text
label string The text for the label element
separator string The text separator. for example : ":"
text string The text for the contact info
id valid css id optional css id
class valid css class multiple classes can be separated by space or comma optional css class
Social Link Element
[wpsociallink
   class="someclass"
   id="someid"
   tumblr="Valid Url for link"
   facebook="Valid Url for link"
   google-plus="Valid Url for link"
   pinterest="Valid Url for link"
   linkedin="Valid Url for link"
   github="Valid Url for link"
   twitter="Valid Url for link"
   flickr="Valid Url for link"
   youtube="Valid Url for link"
   dribble="Valid Url for link"
   instagram="Valid Url for link"
   weibo="Valid Url for link"
]
Attributes Value Description
class css class valid css class for marking the element
id css id valid css id for marking the element
social network string valid url link to point to the social network
Social Sharing Links
[wpsocialshare
   class="someclass"
   id="someid"
   google="true"
   linkedin="true"
   pinterest="true"
   facebook="true"
   twitter="true"
]
Attributes Value Description
class css class valid css class for marking the element
id css id valid css id for marking the element
social network string valid url link to point to the social network
Property Agents Attributes
[vagentsattributes
  userid="numeric"
  agents_xxxxxx="true"
]
Attributes Value Description
userid numeric valid user id that has property_agents role
agents_xxxxxx boolean the xxxxx must be valid property_agents attribute machine id. and value false to hide the attribute, no need to pass this option if you want to show attribute.
Property Agents Fields
[vagentsfields
  userid="numeric"
  agents_xxxxxx="true"
]
Attributes Value Description
userid numeric valid user id that has property_agents role
agents_xxxxxx boolean the xxxxx must be valid property_agents fields machine id. and value false to hide the field, no need to pass this option if you want to show attribute.
Property Agents Listing
[vagentlisting
   agents="1,2,3"
   post_per_page="6"
   order_by="date"
   order="DESC"
   id="xxx unique id"
   ajax="true"
   mini="true"
   pager="true"
   template="agents-grid"
   columns_mobile="12"
   columns_tablet="6"
   columns_small="4"
   columns_large="3"
]
Attributes Value Description
agents numeric separated by comma valid user id for agents separated by comma, only agents property listing specified in this argument will be retrieved.
posts_per_page numeric number of property by agents to fetch
orderby string sorting options, see WP_Query - orderby for valid value
order string sorting options, valid value DESC (descending) or ASC (ascending)
id string Query unique id, the string input here must be unique and no other shortcode, widgets or main loop using this query to prevent broken filtering.
ajax boolean Enable or disable ajax operation for this loop
mini boolean Show mini pager (only prev and next shown) instead of full pager element
pager boolean show or disable the pager elements
template string the template name to use for displaying the teaser items, valid value are agents-grid and agents-list or other template that is registered via VTCore templating system.
columns_xxxxx numeric the bootstrap column size for formatting the teaser items width.
Property Agents Search
[vagentssearch
  id="xxx unique id"
  ajax="true"
  redirect="url"
  visibility__*="true"
]
Attributes Value Description
id string Query id, the value must be a valid agents query id, can be widgets, shortcode or static query in the theme's template. if empty will fallback to the default theme main query id : property-agents-main-loop
ajax boolean Enable or disable ajax operation for this search form
redirect string this option will redirect the search form upon submission to the url as specified in the value. ajax options will not work if this form is set for redirection. upon redirection, the redirected page must have valid agents loop object (can be in form of widget, shortcode or static query) with the same query id as the specified id arguments.
visibility_xxxxxxx boolean specify the field or attributes machine name as the xxxxx with false as the value for hiding the field or attributes from the search form.
Property Attributes
[vpropertyattributes
  postid="numeric"
  property_xxxxxx="true"
]
Attributes Value Description
postid numeric valid property post id
property_xxxxxx boolean the xxxxx must be valid property attribute machine id. and value false to hide the attribute, no need to pass this option if you want to show attribute.
Property Fields
[vpropertyfields
  postid="numeric"
  property_xxxxxx="true"
]
Attributes Value Description
postid numeric valid property post id
property_xxxxxx boolean the xxxxx must be valid property field machine id. and value false to hide the field, no need to pass this option if you want to show field.
Property Listing
[vpropertyloop
  title = "string for the block title"
  description = "string for the block description"
  id = "uniqueid"
  ajax = "boolean"
  type = "boolean"
  pager = "boolean"
  drill = "boolean"
  mini = "boolean"
  infinite = "boolean"
  prev_text = "some text"
  next_text = "some text"
  posts_per_page = "number of post per page"
  loading-text = "ajax loading text"
  all = "the all button text"
  template = "grid|list"
  teaser_columns_mobile="X"
  teaser_columns_tablet="X"
  teaser_columns_small="X"
  teaser_columns_large="X"
]
Attributes Value Description
title string string for the element title
description string string for the element description
id string Query unique id, the string input here must be unique and no other shortcode, widgets or main loop using this query to prevent broken filtering.
ajax boolean Enable or disable ajax operation for this loop
mini boolean Show mini pager (only prev and next shown) instead of full pager element
type boolean Show the property type taxonomy terms filters
drill boolean allow drilling for the taxonomy terms filter, this will only work if the taxonomy set for the taxonomy terms filtering has hierarchical children tree.
pager boolean show or disable the pager elements
infinite boolean use infinite scrolling instead of normal pager
prev_text string text for pager previous button
next_text string text for pager next button
posts_per_page numeric number of property to display in a single page
loading-text string text for ajax when loading
all string text for show all button on the taxonomy terms filter
template string the template name to use for displaying the teaser items, valid value are property-masonry, property-grid and property-list or other template that is registered via VTCore templating system.
teaser_columns_xxxxx numeric the bootstrap column size for formatting the teaser items width.
Property Search
[vpropertysearch
  types="1,2,3,4,5"
  action="url to post the form"
  id="unique wploop id to link this search form to"
  ajax="true"
  search_alignment="vertical|horizontal"
  search_title = "some text for the search box title"
  search_description = "some text for the search box description"
  fields__{field machine name} = hidden // disable a single field
  attributes__{attributes machine id} = hidden // disable a single attributes
]
Attributes Value Description
types string specify allowed property types taxonomy terms id separated by comma. if empty all property types will be available for search
id string Query id, the value must be a valid property query id, can be widgets, shortcode or static query in the theme's template.
ajax boolean Enable or disable ajax operation for this search form
action string this option will redirect the search form upon submission to the url as specified in the value. ajax options will not work if this form is set for redirection. upon redirection, the redirected page must have valid property loop object (can be in form of widget, shortcode or static query) with the same query id as the specified id arguments.
search_alignment string align the search form input, valid value is vertical or horizontal
search_title string the title for the search element box
search_description string the description for the search element box
fields__xxxxxxx boolean specify the field machine name as the xxxxx with hidden as the value for hiding the field from the search form.
attributes__xxxxxxx boolean specify the attribute machine name as the xxxxx with hidden as the value for hiding the attribute from the search form.
Property Maps
[vpropertymap
  title="some title"
  description ="some description"
  posts_per_page = "number of marker per page"
  search = "true|false" build the search box
  search_position = "top|left|right|bottom"
  search_alignment = " vertical|horizontal"
  search_title = "some text for the search box title"
  search_description = "some text for the search box description"
  types__xx = the property type allowed in the search box
  data__xx = a single data-* attributes for the maps element
  fields__{field machine name} = hidden // disable a single field
  attributes__{attributes machine id} = hidden // disable a single attributes
]
Attributes Value Description
title string title for the maps element
description string text for the description of the maps element
posts_per_page numeric maximum post fetched per query
search boolean show or hide the search form
search_position string position for the search form, valid value is top or left or right or bottom
search_alignment string align the search form input, valid value is vertical or horizontal
search_title string the title for the search element box
search_description string the description for the search element box
types__xxxxxxx string define the property type machine id allowed in the search form
data__xxxxxxx mixed add HTML5 data-* attributes for the maps element
fields__xxxxxxx string specify the field machine name as the xxxxx with hidden as the value for hiding the field from the search form.
attributes__xxxxxxx string specify the attribute machine name as the xxxxx with hidden as the value for hiding the attribute from the search form.
Property Metro
[vpropertymetro
  title = "string for the block title"
  description = "string for the block description"
  type = "boolean"
  auto_fill = "boolean"
  posts_per_page = "number of post per page"
  all = "the all button text"
]
Attributes Value Description
title string title for the element
description string text for the description of the element
posts_per_page numeric maximum post fetched per query
type boolean show or hide the property type filters
auto_fill boolean attempt to auto fill the viewport if possible using javascript
all string the text for the show all button in the property type filters
Property Type
 [vpropertytype
   postid="numeric"
 ]
Attributes Value Description
postid numeric the property post id to fetch the property type from.

CSS Helper Classes

The CSS Helper classes is located at assets/theme/css/styleclass.css and it is designed for use in Visual Composer. The classes can help you to format the Visual composer element by adding additional class to its element.
Headline Title
.headline-title
Headline Sub-Title
.headline-subtitle
Element Title
.element-title
Extra Large Title
.title-extra-large
Large Title
.title-large
Small Title
.title-small
Diamond Shape
.diamond

Markup :
<div class="diamond">
  <div class="border">
    <img ...>
  </div>
</div>           
Circle Shape
.rounded

Markup :
<div class="rounded">
  <div class="border">
    <img ...>
  </div>
</div>           
Round Edge
.round-edge
Number List
.number-list

Markup :
<div class="number-list">
  <div class="some class">
    <img ...>
  </div>
</div>           
Hiding form label
.label-hidden label
No Padding
.nopadding
Right Padding
.rightpadding
Remove Left padding
.nopaddingleft
Remove Right padding
.nopaddingright
Text Uppercase
.text-uppercase
Extra Bold
.text-extra-bold
Extra Large
.text-extra-large
Bold
.text-bold or .bold
Text Large
.text-large
Text Medium
.text-medium
Text Small
.text-small
Text Italic
.text-italic
Text Light
.text-light
Children Inline
.children-inline
Display Inline
.display-inline or .pull-inline
Vertical Middle
.vertical-middle
Vertical Top
.vertical-top
Vertical Bottom
.vertical-bottom
Clear Both
.clearboth
Box Shadow
.box-shadow
No Overflow
.no-overflow

Actions System

The action still utilizes WordPress native hook action system and you can still use the native WordPress action system if you don't want to use the VTCore actions system.
/**
 * Example class for hooking into init action
 * If the actions name has underscore in it (_), the class name must
 * use double underscore in order for the autoloader class able find the 
 * right file.
 *
 * Example : 
 *  Action name : init_with_underscore
 *  Class name  : VTCore_Zeus_Actions_Init__With__Underscore
 *  File name   : init_with_underscore.php
 *
 * Arguments
 * ---------
 * if the actions caller has multiple function arguments, you must specify
 * the argument total number in the $arguments and pass the arguments
 * to the actions methods
 *
 * Example :
 *   Action caller           :  do_action('init_with_underscore', $argument1, $argument2, $argument3)
 *   The class variable      :  private $argument = 3;
 *   The class action method :  public function action($argument1 = NULL, $argument2 = NULL, $argument3 = NULL) {} 
 *
 * Weight
 * ------
 * You can specify the weight for the actions by adding $weight variable to
 * the class, This weight will be applied to the entire class.
 * 
 * Example :
 *   Desired weight     : 20
 *   The class variable : private $weight = 20;
 *
 * @see VTCore_Wordpress_Models_Hook
 */
class VTCore_Zeus_Actions_Init
extends VTCore_Wordpress_Models_Hook {

  // The default argument settings
  private $argument = 1;


  // The default weight settings
  private $weight = 10;
  
  // The method that will be invoked by
  // WordPress action hook
  public function hook() {
  
    // Insert the code block for this action as usual.
  
  }
}

Filters System

The filter system still utilizes WordPress native hook filter system and you can still use the native WordPress filter system if you don't want to use the VTCore filtering system.
/**
 * Example class for hooking into the_excerpt filter
 * If the filter name has underscore in it (_), the class name must
 * use double underscore in order for the autoloader class able find the 
 * right file.
 *
 * Example : 
 *  Filter name : filter_with_underscore
 *  Class name  : VTCore_Zeus_Filters_Init__With__Underscore
 *  File name   : init_with_underscore.php
 *
 * Arguments
 * ---------
 * if the filter caller has multiple function arguments, you must specify
 * the argument total number in the $arguments and pass the arguments
 * to the filter methods
 *
 * Example :
 *   Filter caller           :  apply_filters('init_with_underscore', $argument1, $argument2, $argument3)
 *   The class variable      :  private $argument = 3;
 *   The class filter method :  public function hook($argument1 = NULL, $argument2 = NULL, $argument3 = NULL) {} 
 *
 * Weight
 * ------
 * You can specify the weight for the filter by adding $weight variable to
 * the class, This weight will be applied to the entire class.
 * 
 * Example :
 *   Desired weight     : 20
 *   The class variable : private $weight = 20;
 *
 * @see VTCore_Wordpress_Models_Hook
 */
class VTCore_Zeus_Filters_The__Excerpt
extends VTCore_Wordpress_Filters_Base {
  
  // The default argument settings
  private $argument = 1;


  // The default weight settings
  private $weight = 10;
  
  
  // This method will be invoked by WordPress Filter
  public function hook($excerpt = NULL) {
    return $excerpt;
  }
}

Schemas System

This is intended for developer to create a new custom color schema programatically, it is not required for normal user to perform this method as the theme already provides a GUI for customizing color schema.
/**
 * Example Schema
 * This example schema has following data :
 *   Schema machine name    : example
 *   Folder name            : schemas/example
 *   Class name             : VTCore_Zeus_Schemas_Example_Register
 *   File name              : schemas/example/register.php
 *
 *
 */
class VTCore_Zeus_Schemas_Example_Register
extends VTCore_Zeus_Schema_Base {

  // This method is used to define the color schema properties
  protected function setContext() {

    $this->context = array(
    
      // Define the color schema information properties
      'schema' => array(
        'id' => 'example',
        'name' => __('Example schema', BASE_THEME),
        'color' => '#0c88fc',
        'description' => __('This is an example color schema.', BASE_THEME),
      ),

      // Define the color schema sections. this will be used in the
      // Theme options GUI and format the sections as an accordion entry
      'sections' => array(
        'global' => array(
          'title' => __('Style my element', BASE_THEME),
          'active' => 'example',
        ),
      ),

      // Define the color information.
      'color' => array(
        'my_custom_color_one' => array(
          'title' => __('My Custom Color One', BASE_THEME),
          'description' => __('Color for my custom element one' , BASE_THEME),
          'parent' => 'example',
          'selectors' => array(
            '.my-custom-css-selector',
            '#another-custom-css-selector',
          ),
          
         // Rules for background
        'background-color' => '',
        'background-gradient' => '',
        'background-image' => '',
        'background-repeat' => '',
        'background-size' => '',
        'background-position' => '',
        
        // Rules for fonts
        'font-color' => '',
        'font-family' => '',
        'font-size' => '',
        'font-style' => '',
        'font-weight' => '',
        'font-variant' => '',
        'font-stretch' => '',
        
        
        // Rules for border
        'border-width' => '',
        'border-style' => '',
        'border-color' => '',
        'border-radius' => '',
        
        // Rules for links, all the selector will be appended with "a" 
        // to target the links
        'link-color' => '',
        'link-hover' => '',
        'link-focus' => '',
        'link-visited' => '',
        'link-border-color' => '',
        
        
        // Rules for formatting the h1 - h6 elements, all the selectors
        // will be appended h1 - h6 to target the heading elements
        'heading-color' => '',
        'heading-family' => '',
        'heading-style' => '',
        'heading-variant' => '',
        'heading-stretch' => '',
        'heading-weight' => '',
        ),

      ),
    );


    return $this;
  }

}

Custom Templates System

Only use the custom templating system if you want user to be able to select custom template for custom post type using metabox.
Attributes Description
Template Name The name of the template string, this will be used as the name in the select option dropdown entry in the custom template metabox
Template Description The description of the template
Post Types The post type(s) that this template should be visible, separate multiple post type by comma

Assets System

Asset system is a system for easily managing and loading additional CSS and Javascript file easily.
Attributes Description
Template Name The name of the template string, this will be used as the name in the select option dropdown entry in the custom template metabox
Template Description The description of the template
Post Types The post type(s) that this template should be visible, separate multiple post type by comma

Credits

Thank you for the plugins authors that made this theme possible

  • JavaScripts

    • jQuery Easing Plugin - George McGinley Smith
    • jQuery EqualHeight - CSS Tricks
    • jQuery FotoRama - Artem Polikarpov
    • jQuery $.GoMap - pittss
    • jQuery hcsticky - Željko Galetić
    • jQuery Isotope - David DeSandro
    • jQuery resizeEvents - ericprieto
    • jQuery SlickNav - Josh Cope
    • jQuery timers - Jason Chavannes
    • jQuery toTop - Matt Varone
    • jQuery Vertical Center - VicTheme Team
    • jQuery VideoBg - Syd Lawrence
    • jQuery Viewport - Mika Tuupola
    • jQuery Flipcountdown - Chupurnov Valeriy
    • jQuery Flipster - Adrien Delessert
    • jQuery Slick Carousel - Ken Wheeler
    • jQuery Knob - Anthony Terrien
    • jQuery Bootstrap Colorpicker - Stefan Petre
    • jQuery Bootstrap Switch - Mattia Larentis
    • jQuery JvFloat - Jared Verdi
    • jQuery SmoothScroll - Karl Swedberg
  • CSS

    • BootStrap Framework - BootStrap Team
    • FontAwesome - Dave Gandy
  • Fonts

    • Source Sans - Adobe
    • PT Sans - ParaType
    • FontAwesome - Dave Gandy