Blog filter plugin used to categorize your blog post easily on your site. Adding and configure blog filter plugin shortcode on your WordPress sites are explained by developer below. Use the available setting to manage the shortcode, so you don’t need to regenerate shortcode new once.
This is the Default Shortcode
[AWL-BlogFilter blog_template="template1" blog_col_large_desktops="col-lg-4" blog_col_desktops="col-md-4" blog_col_tablets="col-sm-6" blog_col_phones="col-xs-12" blog_image="yes" blog_image_link="yes" blog_image_lightbox="yes" blog_image_hover_effect="hover1" blog_image_quality="medium" blog_title="yes" blog_title_font_size="25" blog_title_color="#000" blog_desc="yes" blog_desc_characters="100" blog_desc_font_size="14" blog_desc_color="#a4a6ac" blog_desc_box_color="#EDEEF0" blog_read_more="yes" blog_read_more_text="Read More" blog_date="yes" blog_author_below_image="yes" blog_order_by="date" blog_order="DESC" blog_filter_order_by="title" blog_filter_order="ASC" blog_pagination="yes" blog_pagination_color="#58BBEE" blog_per_page="12" blog_filters="yes" blog_search="yes" blog_filtering="blog_category" blog_buttons_color="#58BBEE" selected_categories="11,5" exclude_categories="" default_cat_filter="none" custom-css=" " ]
You dont have to generate shortcode, again and again, you can edit Edit / Update Blog Filter Shortcode directly on the page.
You can see that there is every key have a value for every setting, we are showing you that how to edit shortcode without regenerate it.
1. Blog Template And Column Settings
1.1 Template Direction Right To Left
You can change template direction to Right to Left to set “Yes” or “No”
(i) For right to left : [AWL-BlogFilter blog_direction="rtl"]
(ii) For left to right : [AWL-BlogFilter blog_direction="ltr"]
1.2 Blog Template
You can select 3 template design for this setting.
(i) To select template 1 : [AWL-BlogFilter blog_template="template1"]
(ii) To select template 2 : [AWL-BlogFilter blog_template="template2"]
(iii) To select template 2 : [AWL-BlogFilter blog_template="template3"]
1.3 Blog Columns On Large Desktops
You can change column for large desktops.
(i) To select 1 Column : [AWL-BlogFilter blog_col_large_desktops="col-lg-12"]
(ii) To select 2 Columns : [AWL-BlogFilter blog_col_large_desktops="col-lg-6"]
(iii) To select 3 Columns : [AWL-BlogFilter blog_col_large_desktops="col-lg-4"]
(iv) To select 4 Columns : [AWL-BlogFilter blog_col_large_desktops="col-lg-3"]
(v) To select 6 Columns : [AWL-BlogFilter blog_col_large_desktops="col-lg-2"]
(vi) To select 12 Columns : [AWL-BlogFilter blog_col_large_desktops="col-lg-1"]
1.4 Blog Columns On Desktops
You can change column for desktops.
(i) To select 1 Column : [AWL-BlogFilter blog_col_desktops="col-md-12"]
(ii) To select 2 Columns : [AWL-BlogFilter blog_col_desktops="col-md-6"]
(iii) To select 3 Columns : [AWL-BlogFilter blog_col_desktops="col-md-4"]
(iv) To select 4 Columns : [AWL-BlogFilter blog_col_desktops="col-md-3"]
(v) To select 6 Columns : [AWL-BlogFilter blog_col_desktops="col-md-2"]
(vi) To select 12 Columns : [AWL-BlogFilter blog_col_desktops="col-md-1"]
1.5 Blog Columns On Tablets
You can change column for tablet devices.
(i) To select 1 Column : [AWL-BlogFilter blog_col_tablets="col-sm-12"]
(ii) To select 2 Columns : [AWL-BlogFilter blog_col_tablets="col-sm-6"]
(iii) To select 3 Columns : [AWL-BlogFilter blog_col_tablets="col-sm-4"]
(iv) To select 4 Columns : [AWL-BlogFilter blog_col_tablets="col-sm-3"]
(v) To select 6 Columns : [AWL-BlogFilter blog_col_tablets="col-sm-2"]
1.6 Blog Columns on Phones
You can change column for phones.
(i) To select 1 Column : [AWL-BlogFilter blog_col_phones="col-xs-12"]
(ii) To select 2 Columns : [AWL-BlogFilter blog_col_phones="col-xs-6"]
(iii) To select 3 Columns : [AWL-BlogFilter blog_col_phones="col-xs-4"]
(iv) To select 4 Columns : [AWL-BlogFilter blog_col_phones="col-xs-3"]
2. Blog Image settings
2.1 Show Blog Image
You can set yes or no for show or hide blog image.
(i) To show image : [AWL-BlogFilter blog_image="yes"]
(ii) To hide image : [AWL-BlogFilter blog_image="no"]
2.2 Link On Image
You can set yes or no for add or remove blog link on blog image.
(i) To add the link on the image : [AWL-BlogFilter blog_image_link="yes"]
(ii) To remove the link on the image : [AWL-BlogFilter blog_image_link="no"]
2.3 Lightbox On Image
You can set yes or no for add or remove lightbox on blog image.
(i) To add lightbox on the image : [AWL-BlogFilter blog_image_lightbox="yes"]
(ii) To remove lightbox on the image : [AWL-BlogFilter blog_image_lightbox="no"]
2.4 Image Hover Effect
You can select 5 types of haver effects for the blog image.
(i) To set the first hover effect on the image : [AWL-BlogFilter blog_image_hover_effect="hover1"]
(ii) To set the second hover effect on the image : [AWL-BlogFilter blog_image_hover_effect="hover2"]
(iii) To set the third hover effect on the image : [AWL-BlogFilter blog_image_hover_effect="hover3"]
(iv) To set the forth hover effect on the image : [AWL-BlogFilter blog_image_hover_effect="hover4"]
(v) To set the fifth hover effect on the image : [AWL-BlogFilter blog_image_hover_effect="hover5"]
(vi) if you dont want any hover effect : [AWL-BlogFilter blog_image_hover_effect="none"]
2.5 Image Quility
You can select from 4 type of image quility options for the blog image.
(i) To set the 150×150 px size for blog image : [AWL-BlogFilter blog_image_quality="thumbnail"]
(ii) To set the 300×169 px size for blog image : [AWL-BlogFilter blog_image_quality="medium"]
(iii) To set the 840×473 px size for blog image : [AWL-BlogFilter blog_image_quality="large"]
(iv) To set the full size for blog image : [AWL-BlogFilter blog_image_quality="full"]
3. Blog Title Settings
3.1 Show Blog Title
You can set yes or no for show or hide blog title.
(i) To show title : [AWL-BlogFilter blog_title="yes"]
(ii) To hide title : [AWL-BlogFilter blog_title="no"]
3.2 Blog Title Blow Image
You can select yes or no for show title below the image or Show title upper the image.
(i) To title below the image : [AWL-BlogFilter blog_title_below_image="yes"]
(ii) To title upper the image : [AWL-BlogFilter blog_title_below_image="no"]
3.3 Link On Title
You can select yes or no for add or remove blog link on blog Title.
(i) To add the link to the title: [AWL-BlogFilter blog_title_link="yes"]
(ii) To remove the link to the title: [AWL-BlogFilter blog_title_link="no"]
3.4 Title Text Color
You can change the blog Title text color.
(i) To change the title color paste color the code into inverted commas: [AWL-BlogFilter blog_title_color="#000"]
To get a color code click here
3.5 Title Font Size
You can change the blog Title text size.
(i) To change the title text size change value into inverted commas: [AWL-BlogFilter blog_title_font_size="25"]
4. Blog Description Settings
4.1 Show Blog Description
You can set yes or no for show or hide blog description.
(i) To show description: [AWL-BlogFilter blog_desc="yes"]
(ii) To hide description: [AWL-BlogFilter blog_desc="no"]
4.2 Description Text Color
You can change the blog description text color.
(i) To change the description color, paste the color code into inverted commas:
[AWL-BlogFilter blog_desc_color="#a4a6ac"]
To get a color code click here
4.3 Description Box Color
You can change the blog description box color.
(i) To change the description box color, paste the color code into inverted commas:
[AWL-BlogFilter blog_desc_box_color="#EDEEF0"]
To get a color code click here
4.4 Description Font Size
You can change the blog description text size.
(i) To change the description text size, change the value into inverted commas:
[AWL-BlogFilter blog_desc_font_size="25"]
4.5 How Many Characters Show In Description
You can change the blog description words limit size if you had set read more or excerpt then you cant get more words in blog description.
(i) To change the description characters limit, change the value into inverted commas:
[AWL-BlogFilter blog_desc_characters="100"]
5. Link (URL) Settings
5.1 Show Read More Link
You can set yes or no for show or hide Read More Link.
(i) To show read more link : [AWL-BlogFilter blog_read_more="yes"]
(ii) To hide read more link : [AWL-BlogFilter blog_read_more="no"]
5.2 Link Open In New Tab
You can set value for redirect link in the new tab or in the same tab.
(i) To set the link in the new tab : [AWL-BlogFilter blog_title="_blank"]
(ii) To set the link in the same tab, you can leave it blank or NULL: [AWL-BlogFilter blog_title=""]
5.3 Text For “Read More” Link
You change the text of “read more”.
(i) To change the value wright in inverted commas: [AWL-BlogFilter blog_read_more_text="Read More"]
6. Post Meta Settings
6.1 Show Post Date
You can set yes or no for show or hide the post date.
(i) To show the post date : [AWL-BlogFilter blog_date="yes"]
(ii) To hide the post date : [AWL-BlogFilter blog_date="no"]
6.2 Show Date Below The Image
You can set yes or no for the show the post date below the image ore upper the image.
(i) To show date below the image : [AWL-BlogFilter blog_date_below_image="yes"]
(ii) To show date upper the image : [AWL-BlogFilter blog_date_below_image="no"]
6.3 Show Post Author
You can set yes or no for show or hide the post author.
(i) To show the post author: [AWL-BlogFilter blog_author="yes"]
(ii) To hide the post author: [AWL-BlogFilter blog_author="no"]
6.4 Show Date Below The Image
You can set yes or no for the show the post date below the image ore upper the image.
(i) To show the author below the image : [AWL-BlogFilter blog_author_below_image="yes"]
(ii) To show the author upper the image : [AWL-BlogFilter blog_author_below_image="no"]
6.5 Show Post Categories
You can set yes or no for show or hide the post categories.
(i) To show the post categories: [AWL-BlogFilter blog_categories="yes"]
(ii) To hide the post categories: [AWL-BlogFilter blog_categories="no"]
6.6 Show Post Tags
You can set yes or no for show or hide the post tags.
(i) To show the post tags: [AWL-BlogFilter blog_tags="yes"]
(ii) To hide the post tags: [AWL-BlogFilter blog_tags="no"]
7. Pagination Settings
7.1 Pagination
You can set yes or no for show or hide Pagination.
(i) To show the Pagination : [AWL-BlogFilter blog_pagination="yes"]
(ii) To hide the Pagination : [AWL-BlogFilter blog_pagination="no"]
7.2 Pagination Color
You can change the blog Pagination color.
(i) To change the Pagination color, paste the color code into inverted commas:
[AWL-BlogFilter blog_pagination_color="#58BBEE"]
To get a color code click here
7.3 Blogs On Per Page
You can change the blog limit for per page if you wanna show all blogs on the single page then set zero (0) in the value and set ‘no’ in pagination.
(i) To change the blog limit for per page, change the value into inverted commas:
[AWL-BlogFilter blog_per_page="25"]
8. Posts Order Settings
8.1 Post Order by
You can set post order by date or title or slug.
(i) Set post order by date: [AWL-BlogFilter blog_order_by="date"]
(ii) Set post order by title: [AWL-BlogFilter blog_order_by="title"]
(iii) Set post order by slug: [AWL-BlogFilter blog_order_by="name"]
8.2 Post Order
You can also set ascending or descending order for the post
(i) Set ascending order for posts: [AWL-BlogFilter blog_order="ASC"]
(ii) Set descending order for posts: [AWL-BlogFilter blog_order="DESC"]
9. Filter Order settings
9.1 Filter Order by
You can set filter order by date or title or slug.
(i) Set filter order by date: [AWL-BlogFilter blog_filter_order_by="date"]
(ii) Set filter order by title: [AWL-BlogFilter blog_filter_order_by="title"]
(iii) Set filter order by slug: [AWL-BlogFilter blog_filter_order_by="name"]
9.2 Filter Order
You can also set ascending or descending order for the post
(i) Set ascending order for filters: [AWL-BlogFilter blog_filter_order="ASC"]
(ii) Set descending order for filters: [AWL-BlogFilter blog_filter_order="DESC"]
10.Thumbnail Settings
10.1 Thumbanil Hover Effect
You can enable or disable thumbnail hover effect.
(i) To enable hover effect : [AWL-BlogFilter blog_thumb_hover="yes"]
(ii) To disable hover effect: [AWL-BlogFilter blog_thumb_hover="no"]
10.2 Thumbnail Spacing
(i) To change the thumbnail spacing, change the value into inverted commas:
[AWL-BlogFilter blog_thumb_spac="5"]
11.1 Show Filters
You can set yes or no for show or hide filters.
(i) To show the filters: [AWL-BlogFilter blog_filters="yes"]
(ii) To hide the filters: [AWL-BlogFilter blog_filters="no"]
11.2 Show Filter “All”
You can set yes or no for show or hide filter “All”.
(i) To show the filter “All”: [AWL-BlogFilter blog_filter_all="yes"]
(ii) To hide the filter “All”: [AWL-BlogFilter blog_filter_all="no"]
11.3 Text For “All” Button
You can change text for “All” button.
(i) To change text for “All” button, change the value into inverted commas:
[AWL-BlogFilter blog_all_text="All"]
11.4 Multi-Filter In Same Time
You can set yes or no for multi-filter function.
(i) To On multi filter function: [AWL-BlogFilter blog_multi_filter="yes"]
(ii) To Off multi filter function: [AWL-BlogFilter blog_multi_filter="no"]
11.5 “And” Logic For Multi-Filter
You can use yes or no for And logic in multi-filter function.
(i) To On multi filter “And” logic: [AWL-BlogFilter blog_multi_filter_logic="yes"]
(ii) To Off multi filter “And” logic: [AWL-BlogFilter blog_multi_filter_logic="no"]
11.6 Show Search Field
You can set yes or no for show or hide search field.
(i) To show the search field: [AWL-BlogFilter blog_search="yes"]
(ii) To hide the search field: [AWL-BlogFilter blog_search="no"]
11.7 Text For Search Field
You can change text for search field.
(i) To change text for search field, change the value into inverted commas:
[AWL-BlogFilter blog_search_text="Search"]
11.8 Buttons Color
You can change the blog button color.
(i) To change the button color, paste the color code into inverted commas:
[AWL-BlogFilter blog_buttons_color="#58BBEE"]
To get a color code click here
11.9 Filtering with
You can change filtering option.
(i) To set blog categories as filter: [AWL-BlogFilter blog_filtering="blog_category"]
(ii) To set blog tags as filter: [AWL-BlogFilter blog_filtering="blog_tag"]
11.10 Default filter
You can set any filter for default selected filter on page load
(i) If you are using category as filtering option, chnage the the category id into inverted commas :
[AWL-BlogFilter default_cat_filter="27"]
(ii) If you are using tag as filtering option, chnage the the tag id into inverted commas :
[AWL-BlogFilter default_tag_filter="27"]
11.11 Selected Categories Or tags For Blogs
To change the categories and tags ids directly from the shortcode, change the value into inverted commas:
(i) If you are using category as filtering option: [AWL-BlogFilter selected_categories="2,5,8,15,20,25"]
(ii) If you are using tag as filtering option: [AWL-BlogFilter selected_tags="2,5,8,15,20,25"]
11.12 Exclude Post
You can exclude post that are related with some categories or tags, change the value into inverted commas:
(i) If you are using category as filtering option: [AWL-BlogFilter exclude_tags="2,5,8,15,20,25"]
(ii) If you are using tag as filtering option: [AWL-BlogFilter exclude_tags="2,5,8,15,20,25"]
