DGWork Theme Documentation

Created: September 2016 / Current Version: 1.6.0 / by ThemeVan

Introduction

Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, You can asking on the support forum after you sign up with your purchased code. Thanks so much!

Support Forums

Any questions that are beyond the scope of this help file, asking on Support Forum

Visit Support Forum

Follow Us

Follow us on ThemeForest and don't miss our new upcoming premium themes.

Follow on ThemeForest

Rate Theme & Support

If you like our theme or support, please rate on ThemeForest in your download page.

Rate on ThemeForest

Getting Started

If you are first time to use WordPress, I think maybe you need to read the offical documentation for how to use WordPress, click here to read it.

About WordPress installation, you should download the latest version of WordPress code from WordPress.org, then upload all the WordPress files to your webhost(Some webhost is provide one-click installation, e.g. Bluehost or Siteground), then, visit your website with your IP address or domain name, fill the MY SQL and Administrator information step by step. You can refer to the following Video:

Also, there are many useful How-to videos in WordPress.tv

Theme Installation

Unzip the downloaded package. Find the zipped theme file called dgwork_theme_v1.x.zip.

Go to "Appearance > Themes" in your dashboard side menu. Click “Install Themes” tab and upload the zipped theme file. Activate it after uploading is finished.

You can also unzip the installation zip file and upload the theme folder to "/wp-content/themes" directory via FTP client.

Initialization

After you actived the theme, please initalize the theme as the following steps.

1. Change default image size to double size for retina screen

First of all, we strongly suggest you change the default image size to double size in "Setting > Media" in order to make the images looks more clear on Retina screen.

If you have already uploaded images before, you should regenerate all old thumbnails with regenerate thumbnail plugin.

2. Register the purchase code

After you installed and actived the theme, please go to Appearance > Registration page, submit your purchase code in order to get the permission to install the core plugin and theme auto update.

3. Install the require plugins

Go to Appearance > plugins page, just install all the required plugins and neccessary recommended plugins.

3. Manual Setup or one click import the sample data

If you are unfamiliar with this theme or not super experienced with Wordpress we HIGHLY recommend you to install the sample data before moving forward. It will be easier for you to remove this data later than to spend tons of time trying to figure out set this theme up without using the dummy data. Jumping to Sample data section.

Shop Setup

1) Create Account page with 'Account template' for the user dashboard.

2) Go to DGWork Options > Shop, assign the checkout and account page.

Add the other content which you need

Then, add the post categories, some pages which you need, for example, about, contact,etc.. Don't forget to set up the custom menu in "Appearance > Menus" and put the pages and categories into the primary menu and mobile menu.

Sample Data

If you are newbie and unfamiliar to use this theme, you can import the demo data to get started quickly.

Go to Appearance > Import Demo, just click the import data, waiting for a few minutes until the demo files and data are imported.

That's it! Is it so easy?

Then, your website will be as same as our demo site . Just modify the content based on the sample pages.

Page Templates

We include the following page templates for you. If you want to create a new custom homepage or blog page, you can select the specific page template from the Page Attributes box.

  • - Account Template

    Select this template for the user account page.

  • - Blank Template

    You can select this template for your own custom home page or inner page with fullwidth layout without page header section..

    Check the Demo page

  • - Blank Template With Header

    You can select this template for the page with fullwidth wrapper and page header section..

    Check the Demo page

  • - Default Template With Sidebar

    If you want to create a standard page with sidebar, just select this page.

  • - Grid Blog Template

    If you want to make your blog page displays as the grid layout, just create a new page and select this template. Check Demo

  • - Overlap Blog Template

    This special blog template will make your blog page looks like below Check Demo

  • - Masonry Blog Template

    A masonry blog template with two columns. Check Demo

  • - Standard Blog Template

    This is a standard blog template without sidebar. Check Demo

Product Category Setting

Here are two extra settings we include in the Product Category setting page. As you can see, they are "template" option and "page header picture" field that allow you to select the category template and set the header picture.

Product Content Templates

We include predefined custom product content template in the WPBakery Page Builder template list, you can quick to set up the complex layout for the product content.

You should enable the WPBakery Page Builder editor for the download post type via WPBakery Page Builder settings > Role manager

Then, when you edit or add a product post, switch to the WPBakery Page Builder editor, open the template list window and select the template as below:

Content Block

After you activated ThemeVan Toolkit plugin, you will see "Content Block" post type will be added in the admin side menu. You can add your custom content block for custom footer and mega menu.

Add Custom Footer: First of all, you could hide the default footer via Appearance > Theme options > General Settings. Then, create a new content block with WPBakery Page Builder, save it and go to Appearance > Widgets page, drag a content block widget to the custom footer area, select your block. Then the custom footer will be displayed as the global footer.

As you can see in the content block editing page, there's a shortcode in the right sidebar. You can copy it to anywhere you want to insert this content block.

Mega Menu

Since V1.6, we added built-in mega menu module. You can create the mega menu via Content Block, then design it with WPBakery Page Builder. The last step, just go to Appearance > Menu page, select the mega menu you created.

Theme Options

The theme option panel is based on Redux Framework, you can find it via the sidebar of WP admin page.

And we also integrated all theme options into the WP customizer (Appearance > Customize), you can preview the result in real time when you made changes.

Widgets

There are 8 widget areas in "Appearance > Widgets" like below

"Bottom widgets" will show up at the bottom section of each pages.

In particular, "(dgwork) Recent Posts with thumbnail", "(dgwork) Recent Comments" are our custom widgets.

Customization

  • - Secondary development

    If you are going to secondary develop the theme, please don't modify the source code of the theme, you'd better create a child theme, or add your custom css or javascript in "DGWork Options > Custom Code > CSS codes(or javascript code)", it will not conflict with the future upgrading, otherwise, you can't upgrade your theme smoothly.

    For how to create a child theme, you can refer to the following offical documentation, http://codex.wordpress.org/Child_Themes . Also, our support service is not include helping user to create a child theme, but we would like to answer your questions about the php function, file structure or CSS.

  • - Hooks

    We include the template parts in some hooks that you should know them if you want to customize the theme by yourself. You can find the hooks in "inc/functions/hooks.php" and "inc/edd/hooks.php"

    How to use hook for make some changes?
    Let's say this one add_action( 'dgwork_before_content', 'dgwork_before_content' );, the second parameter is the hooked function:

    if ( ! function_exists( 'dgwork_before_content' ) ) :
    /**
    * Before Content
    */
    function dgwork_before_content(){
    echo '<div id="page" class="hfeed site dgw-grid-1000">
    <div id="content" class="site-content">';
    }
    endif;

    Now, you can define a new hooked function like below

    if ( ! function_exists( 'new_before_content' ) ) :
    /**
    * New Before Content
    */
    function new_before_content(){
    echo 'I just wanna insert this line above the page container!'; echo '<div id="page" class="hfeed site dgw-grid-1000">
    <div id="content" class="site-content">';
    }
    endif;

    Then, remove the old hooked function with remove_action() and hook the new function

    remove_action('dgwork_before_content','dgwork_before_content');
    add_action('dgwork_before_content','new_before_content');

    If you have any questions about the hooks usage, don't hesitate to ask question on the support forum .

  • - Support Service

    If you want to looking for the customization service, unfortunately, we are not provide customization service, the support service is only include fixing bug and trouble using. Maybe you can look for a freelancer developer on http://studio.envato.com/ or http://freelancer.com

Localization

This theme is ready for localization. We have made every string translate able with the text domain "dgwork", use Poedit  editor to translate it, or install CodeStyling Localization plugin to translate the text.

For how to create your own language file, please do it as following steps

  1. Go to /wp-content/themes/dgwork/languages directory, you will find the default.po file
  2. Just copy this file and rename the file in format language.po (ie. pt_BR.po, de_DE.po, etc.)
  3. Then, open this file with Poedit editor, translate all words to your language, save the file.
  4. Go to "Setting > General > Site language", you will find the language options at the bottom, select your language.

Upgrade

Every times when we release the new version, please note that if you haven't modified any source files of the theme, just remove the old version and reinstall the new version directly, if you have changed some source files, you can't simply reinstall the new theme, it's hard to upgrade, you must move all your changed codes to the new theme before you reinstall or override the old files.

Credits

thanks all creator of these great files

All pictures in the demo site are from pexels.com and pixabay.com

Thanks for your reading, enjoy in the theme!