Contents

1. How to add titles to image

2. How to add author social icons

3. How to create a "Contact Forms"

4. How to make gallery responsive

5. How to copy the Gallery

6. How to create aligned Gallery with custom width and text

7. How to set up Navigation Menus

8. How to set a Custom Sidebar for custom post/page

9. How to create a page with Custom Sidebar

10. ​How to add a "Featured Image"

11. How to set "Home" & "Blog" pages

12. Installing the Plugin

13. How to edit the Gallery.

14. Visual Composer. What is it & how to use.

15. Add Your User Social Network Icons.

16. How to set Pages (pagination) for images

17. How to create a Template

18. Getting started with Fenomen

19. How to load Gallery in PHP

20. How to create a Gallery

21. How to create a "Gallery" post

22. How to create an "Image" post

23. How to create filtered Gallery

24. How to set video instead of image for Lightbox

25. How to create Menu and setup Menu Locations

26. How to create a "Featured Area"

27. How to create a "Static" page

28. How to set a Custom 404 page

1. How to add titles to image

Hybrid Gallery plugin uses default WordPress attachment fields to display title & description.

Official gallery website: https://hybrid-gallery.com


2. How to add author social icons

DivBlog theme has its own custom fields for author social icons.

1. To add social icon links, go to "Users" > "All Users" > "Select user" > scroll to "Social Links".

2. Move to panel "DivBlog" > "Blog" > "Author Page" and build your own custom style for social icons and author box.

But it is only for author page. You need to build the same for the author box in a "Single Post". But you can create a different style for single post and author page.

3. For Single Post page move in "DivBlog" panel to tab: "Single Post" > "Author Box".

3. How to create a "Contact Forms"

How to create own contact forms and insert them into pages.

1. First, we need to install "Contact Form 7" plugin. In "Fenomen" theme it has already included, but if not works for some reason, open Admin Panel - > Plugins -> Add New and type "Contact Form 7".

2. Go to "Contact" -> "Contact Forms" -> "Add New".

Add following code and click "Save".

<p>[text* your-name placeholder "Name*"]</p>
<p>[email* your-email placeholder "Email*"]</p>
<p>[text your-subject placeholder "Subject"]</p>
<p>[textarea your-message placeholder "Message..."]</p>
<p>[submit "Send"]</p>

3. Go to "Pages" -> "Add New".

Add Element "Contact Form 7" with Visaul Composer (or you can just paste contact form 7 shortcode).

Select your contact form and save it. Now page with contact form is ready. Just publish it.

4. How to make gallery responsive

Hybrid Gallery is fully responsive for all screens and devices. But by default responsive options are turned off. o you need to select your custom responsive options.

Let's make responsive grid gallery.

1) Click on "Hybrid Gallery" button.


2) Select Grid layout.


3) Add images and select options. For example if you've selected 4 columns for gallery, you need to select columns for other screen sizes too.


4) Go to Responsive tab and select:


  -- 3 Columns for <=768px screens,

  -- 2 Columns for <= 600px screens,

  -- 1 Column for <= 480px screens.

This screen sizes are not required and you can set your own screen sizes (e.g. 850px instead of 768px).


And now gallery is responsive.


Official gallery website: https://hybrid-gallery.com

5. How to copy the Gallery

Once you've created a gallery, you can copy and paste in other place. You just need to click on "copy" icon.

Official gallery website: https://hybrid-gallery.com


6. How to create aligned Gallery with custom width and text

It is possible to set Gallery

  -- alignment: left, right, center or none.

  -- width: in pixels (px) or in percent (%)

Let's see what will be if we set align: left and width: 50%.

In panel we must set:

And here is the result.


You can set responsive options for gallery too. It requires for small screens. So set width: 100%, align: none if screen size is smaller than 600px.

Official gallery website: https://hybrid-gallery.com

7. How to set up Navigation Menus

To set up navigation menus, open admin panel and navigate to Appearance > Menus.

Enter menu name and click the "Create a new menu" button.

Then drag menu items and click the "Save menu" button.

After go to DivBlog panel, open Header > Menu > Select Menu and select from menu list. (for Header Menu).


Open Footer > Menu > Select Menu and select from menu list. (for Footer Menu).

Click the "Save Changes" button.

8. How to set a Custom Sidebar for custom post/page

You can create unlimited sidebars and set each of them for custom post/page. To do this you need to follow this steps:

1. Open Admin > Appearance > Sidebars.

2. Click the button "Add New Sidebar".

Enter the name of sidebar and click "Save Changes".

3. Go to Posts/Pages > Add New.

Input the Title, Content and in right section you will see "Page Customizer" and select the sidebar.


If there isn't available "Page Customizer" metabox, open "Screen Options" at top and check it.


9. How to create a page with Custom Sidebar

For each post/page you can set your own custom sidebar.

Create Custom Sidebar

Go to Admin -> Appearance -> Sidebars. Click "Add New Sidebar" button, type some name (e.g. "My Sidebar") and click "Save Changes".

Now your sidebar is ready. To add widgets in that sidebar, move to Appearance -> Widgets.

Set Custom Sidebar For Post/Page

Create a post/page (fill title, content...) and when it be ready, move to metabox "Page Customizer" and select the sidebar that you have created.

If you can't find there such a metabox, open "Screen Options" at the top and check "Page Customizer" option.

10. ​How to add a "Featured Image"

In Wordpress Featured Images is used as a post main (header) picure. It displays in homepage, blog page, simple pages, related post section, widgets...

To set featured image, in post/page edit screen move to right bottom - called "Featured Image". Click on "Set Featured Image", upload or select from media library and click to save it. Then the picture will appear in that box.


11. How to set "Home" & "Blog" pages

To set Homepage and Blog page follow this steps:

1. Go to Pages > Add New

2. Create 2 pages (one for homepage and one for blog page).

3. Open Divblog Panel > General

4. Select pages.

12. Installing the Plugin

After you have purchased the hybrid gallery plugin, you will recieve plugin file in .zip package.

1) To install the plugin, go to Admin Panel > Plugins

2) Click the "Add New" button > then "Upload Plugin" button.


3) select .zip package & click "Insall Now". After that activate the plugin and start to use it.


13. How to edit the Gallery.

Once you have created a gallery, you can edit it by clicking on "pencil" icon.

Then select new options and click "Insert" button.

Official gallery website: https://hybrid-gallery.com


14. Visual Composer. What is it & how to use.

"Fenomen" theme comes with Visual Composer plugin. It a powerful drag & drop content builder plugin for WordPress.

First, navigate to "Pages" -> "Add New". If plugin is installed, you will see Visual Composer section. If not, just click "Backend Editor" button.

Then click the "Add Element" button and select which element (shortcode) you want.

To create beautiful "Fenomen" blocks like in demo page, select Fenomen tab.


15. Add Your User Social Network Icons.

Every author can output its social network information at author box (in single post page & author page).

Open User data editor page. It's available in Admin -> Users -> User Page (Edit).

Navigation to "User Social Links" section and fill social network links.


16. How to set Pages (pagination) for images

You can break images into pages (pagination). 

1) In "Hybrid Gallery" options panel open Pagination tab.

2) Enable pagination option.


There are multiple types of pagination:

  -- Numeric: Pages with numbers,

  -- Classic: Previous and Next pages,

  -- Show More: Add new images by clicking on "show more" button,

  -- Scroll: Add new images on scroll: "infinite scroll".

For NumericClassic types you can enable "AJAX" mode, which means that the pages will be load without refreshing.


Images per page: here you can set number of images to show per page.

Official gallery website: https://hybrid-gallery.com


17. How to create a Template

For example if you've selected some options & want to use it multiple times, but tired of each time customization, you can save options as template and load it with one click.

1) To save the options, click "Save Template" button.


2) Enter template name and click right icon.


3) After panel will notify that the template was saved.


4) To open template list, click on "Templates" (at the top).


5) Click on template name that you want to load.


18. Getting started with Fenomen

So, let's start.


Installing The Theme

After you have purchased the Theme, you will recieve theme file in .zip package.

To install the theme, go to Admin Panel > Appearance > Themes.

Click the "Add New" button > Click the "Upload Theme" button


After that activate the theme and start to use it.



Installing Plugins

After theme installation you need to install the plugins. First install requied plugins, after that recommended plugins. Required plugins must be installed to help theme works properly.



Importing Demos

To create complete site like in demos:

1. Open Fenomen tab to enter to the Theme Options Panel.


2. Select Demo Content tab and import one of the demos.


That's all.

19. How to load Gallery in PHP

If you want to load gallery in php, you need to paste gallery code in do_shortcode function.

For example, if gallery code is: 

[hybrid_gallery_grid ids="4619,4618,4610,4615,4614,4599,4613,4612,4616,4607,4617,4611" layout="grid" metro_style="1" size="equal" ratio_w="1" ratio_h="1" cols="3" rowheight="240" max_rowheight="-1" lastrow="nojustify" gap_x="10" gap_y="10" color="#b90000" style="1" meta_title="false" meta_descr="false" click_action="lb" link_tg="same" buttons="false" lightbox="mp" pagination="false" pg_type="more" pg_ajax="false" pg_posts="10" filter="false" animation="fadeInUp" preloader="1" ct_w_vl="100" ct_w_un="pc" ct_align="none" custom_class="" custom_id="" res="{#1024#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#800#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#768#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#600#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#480#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#1#,#align#:#auto#}}"]

You need to paste the code in php in this way:

<?php 
    echo do_shortcode('[hybrid_gallery_grid ids="4619,4618,4610,4615,4614,4599,4613,4612,4616,4607,4617,4611" layout="grid" metro_style="1" size="equal" ratio_w="1" ratio_h="1" cols="3" rowheight="240" max_rowheight="-1" lastrow="nojustify" gap_x="10" gap_y="10" color="#b90000" style="1" meta_title="false" meta_descr="false" click_action="lb" link_tg="same" buttons="false" lightbox="mp" pagination="false" pg_type="more" pg_ajax="false" pg_posts="10" filter="false" animation="fadeInUp" preloader="1" ct_w_vl="100" ct_w_un="pc" ct_align="none" custom_class="" custom_id="" res="{#1024#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#800#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#768#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#600#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#auto#,#align#:#auto#},#480#:{#w#:#auto#,#w_vl#:#100#,#w_un#:#pc#,#cols#:#1#,#align#:#auto#}}"]');
?>

Official gallery website: https://hybrid-gallery.com

20. How to create a Gallery

1. Open Admin Panel and add new page/post.


2. Click on button "Hybrid Gallery".


3. It will open some ready layout types. Choose one of them on it.


4. Next add images to panel. Click on "plus" button.


5. Select images and click "Insert".


6. After that select options that you want and click "Insert".


7. It will create visual shortcode in editor. You can edit, copy or delete it.


That's all.

View all layouts in official wordpress gallery site: https://hybrid-gallery.com



21. How to create a "Gallery" post

Navigate through Admin > Posts > Add New.

Enter some title, click the "Add Media" button.

Click the "Create Gallery" button and mark the media images. Then in Gallery settings select the option (Columns, Navigation, Pagination & Thumbnail Size).


Note! You can set default settings from DivBlog admin panel and it will allow you not to set custom fields any time that you creating a gallery. You can also set custom styles for gallery types.

Just go to Post Formats > Gallery and set Default navigation type, Default pagination type and styles.

Don't forget to check Gallery format at right box.

22. How to create an "Image" post

To add an "Image" post, go to Posts > Add New.

Input title, content and add Feature Image.

And don't forget to select the "Image" post type.


23. How to create filtered Gallery

You can filter images by categories (tags).

1) First you need to add tags to each image.

There is a custom field: "(Hybrid Gallery) - Filter" for attachments.

Tags must be comma separated tags.

2) After that turn on Filter option (in Extra tab).


Official gallery website: https://hybrid-gallery.com

24. How to set video instead of image for Lightbox

You can set video (from YouTube/Vimeo) instead of image to show in lightbox.

Hybrid Gallery has its own extra fields for attachments.

You need to select:

  -- (Hybrid Gallery) - Default Type: Video

 -- (Hybrid Gallery) - VideoYour URL

Official gallery website: https://hybrid-gallery.com


25. How to create Menu and setup Menu Locations

To create menu, go to admin bar -> Menus -> create a new menu.

Enter some name and click the button "Create Menu".

Creating Menu

3. Add Menu items from left box and save.

Set up Menu location

1. Open second tab - "Manage Locations".

2. Choose your menu for location.

26. How to create a "Featured Area"

If you want to create a Featured Area with Page Builder, that will be separated from Content & Sidebar, just follow this steps:

1. Go to Pages > Add New

2. Click the "Add Element" button and Select a "Row" element.

3. After that click "Edit the row" button.

4. And finally check the "Featured Area" field. 

5. Now the Row is ready and you can add there your elements.




27. How to create a "Static" page

If you want to create a simple static page, just follow this steps:

1. Go to Pages > Add New

2. Add some content.

3. At the right "Page Attributes", select template - "Static Page".

4. Now page template is ready and you can publish the page.

28. How to set a Custom 404 page

Let's set a custom 404 page.

First of all:

1. Go to Pages > Add New.

2. Enter the title, e.g. "404 Page".

3. Go to DivBlog panel, enter 404 tab and select that page.