Optimized design for WooCommerce plugin !

Optimized design for WooCommerce plugin !

This theme is compatible with WooCommerce plugin!

WordPress Widgets add content and features to your sidebars. Examples are the default widgets that come with WordPress; for post categories, tag clouds, navigation, search, etc. Plugins will often add their own widgets.

Widgets 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 properly “widgetized” WordPress Themes to include the header, footer, and elsewhere in the WordPress design and structure.

Example of the WordPress Widget Panel
Widgets require no code experience or expertise. They can be added, removed, and rearranged on the WordPress Administration Appearance > Widgets panel. The order and placement is set by the WordPress Theme in the functions.php file.
Some WordPress Widgets offer customization and options such as forms to fill out, includes or excludes of data and information, optional images, and other customization features.

The Widgets SubPanel explains how to use the various Widgets that come delivered with WordPress.

Plugins that come bundled with widgets can be found in the WordPress Plugin Directory .
The Widget menu will only appear of your Theme has active widgetized sidebars. If it does, you can add widgets by:

  • Go to Appearance > Widgets.
  • Choose a Widget and drag it to the sidebar where you wish it to appear. There might be more than one sidebar option, so begin with the first one. Once in place, WordPress automatically updates the Theme.
  • Preview the site. You should find that the “default” sidebar elements are now gone and only the new addition is visible.
  • Return to the Widgets Panel to continue adding Widgets.
  • To arrange the Widgets within the sidebar or Widget area, click and drag it into place.
  • To customize the Widget features, click the down arrow in the upper right corner to expand the Widget"s interface.
  • To save the Widget"s customization, click Save.
  • To remove the Widget, click Remove or Delete.
  • If you change WordPress Themes, the Widgets will return to the left side of the page in the Widget Archives or Available Widgets list. You may need to add them again and rearrangement depending upon the Theme"s ability to preserve other Theme"s Widgets.
One click auto install !

One click auto install !

One click sample data installation

Every templatic theme comes with a file called custom.css. That file enables you to fairly easy customize the look of your site. Instead of finding specific css files you can just input the class name and new properties in the custom.css file.

[templatic_msg_box type=”info”] custom.css cannot work if it”s not activated. Activation path differs from theme to theme, here are some pointers on how to activate it [/templatic_msg_box]

Older templatic themes (Specialist, Hospitality, etc):
wp-admin -> Appearance -> Theme options area -> General Settings -> Customize Your Design

templatic eCommerce themes (eMarket, Emporium, E-commerce, etc)
wp-admin -> Shopping Cart -> Design Settings -> General Settings -> Customize Your Design

Newer templatic themes; themes using templatic framework (DailyDeal, Appointment, GeoPlaces, etc)
wp-admin -> Theme Settings -> Basic Settings -> Style and Color Settings -> Use Custom Stylesheet
wp-admin -> Theme Settings -> Basic Settings -> General Settings -> Use Custom Stylesheet

Themes powered by Supreme (Nightlife, CoolCart, Catalog, etc)
wp-admin -> Appearance -> Themes -> Customize button -> templatic Theme Settings -> Use custom css

After you activate custom.css you can add your new css classes under Appearance -> Editor -> custom.css (it will be listed under stylesheet files in the bottom right corner). If you prefer editing your files using FTP, you should be able to find custom.css in your theme root folder.

If you already have the correct code you can paste it in the file and hit “Update File”. If you don”t know the name of the class you have to edit you must use Firebug. If you”re new to Firebug be sure to read our Firebug tutorial -> http://localhost/docs/how-to-use-firebug/. Make sure that the code you”re adding/pasting is added below the existing content. In other words, after the */ closing comment tag. If you add your code before that tag it will be commented out and will not work.

For more information about custom.css you can watch the following video tutorial. Please watch the tutorial in full screen mode with HD turned on

Good luck and happy customizing