User Tools

Site Tools


Sidebar

magento_2:blog_pro

For more details see the Blog Pro for Magento 2 extension page.

Guide for Blog Pro for Magento 2

Make blogging an effective part of your marketing strategy with Blog Pro for Magento 2. Take advantage of the responsive design and customizable layout settings. Add meta information to the posts, categories, and tags and explore the power of SEO.

  • Use responsive layout design
  • Customize blog posts display
  • Use AMP to make pages work fast
  • Add multi-level category tree and 3D tags for enhanced navigation
  • Manage comments effectively
  • Make your blog user- and SEO-friendly
  • Import blog from WordPress in few clicks
  • Allow users to share your content on social networks

Blog Pro for Magento 2 is a powerful tool for creating an informative blog. Make the posts noticeable by adding images and thumbnails; optimize your posts for search engines, use share buttons to attract new readers and visitors. The module is very flexible and has an intuitive interface.

The extension is compatible with GraphQL. Expose the data like post page, recent posts, posts grid, recent comments, comments, categories tree, tags, author page, category page, etc. in order to build PWA/JS-based frontend

Configure the extension

Blog Pro has many options in the configuration section. Don't worry about such a large number of settings, once the main options are set, posting blog articles becomes a matter of several minutes. To access the settings of 'Blog Pro for Magento 2' please go to Stores → Configuration → Blog Pro

Display Settings

Configure the blog link position on your webstore pages. {{:magento_2:blog-pro:footer-menu-integration.png?nolink|

Title - give a title that will be displayed in the link to the blog.

Display blog on the Footer - enable if you want to display the link to the blog on the footer.

Display Blog on the Toolbar - set to Yes to display the link to the blog in the toolbar.

Display Blog on the Categories Menu - switch to Yes to display the link to blog in the categories menu.

Here is an example of how the footer link looks on the frontend.

Check the example of the links located in the Categories Menu and in the Toolbar.

Search Engine Optimization Section

Optimize the blog for search engines by adding well-thought meta titles, keywords, and description. Your blog will appear higher in search results and thus attract more visitors.

Breadcrumb Label - Specify the label for breadcrumb navigation.

Route - Specify the URL title, which will redirect visitors to your blog page.

Title Prefix - Choose the default prefix that will be displayed in a browser tab when you open a blog category or search for a tag.

This is how the settings look on the frontend.

Blog Meta Title Suffix - The meta title suffix is a permanent text that will be added to the meta title of all post pages. This text will be separated from the meta titles with “ | ”. You can use your brand name as a meta title suffix. This will contribute to your brand awareness.

Blog Meta Title - This is the title of the main blog page in a browser tab.

Blog Meta Keywords - Determine keywords by which customers can find your blog.

Blog Meta Description - This description will be displayed in the search engine results page.

Organization Name - Your company name will be used for creation post microdata.

The extension is designed to increase your blog visibility with microdata: breadcrumb, author, name, description, image. Fill in the appropriate fields while creating a post to better index the articles and make your blog more SEO friendly.

Layout

Here you can arrange blocks with different blog information and specify how they will look on the frontend. Four layout types are available: desktop layouts for the main blog page and for a post page and the same layouts for mobile devices. The blocks are visualized; you can change the order using drag and drop option.

Desktop - It's possible to group the blocks in one, two, or three columns. To add a block, click the 'Plus' button; to delete a block click the basket in its upper-right corner. This is an example of the main blog page; the post page has the same options.

This is the frontend example of the main blog page.

And here is an example of a particular post page.

Mobile - On mobile devices, such as tablets and smartphones, your blog will have a 2-column layout, the other options of the layout constructor are equivalent to Desktop. The screenshots below show how a mobile post looks on the frontend. To see the tab with categories and other blocks, a customer should swipe it from the left or right side.

URLs and Redirects

URL Postfix - The .HTML postfix shows search engines that the page is static and is reliable.

Redirect to SEO formatted URL - If you set the option to 'Yes', customers and search robots will be redirected to the SEO-friendly post page by 301 redirects.

List

List - Define the number of posts displayed on one blog page.

If there are more articles in your blog, visitors can browse content with Older/Newer Entries links.

Post

Display Author Name - Choose 'Yes' if you want to display the name of the post author on the frontend.

Display Print Link - Allow visitors to print out the articles they enjoy.

Display Categories - Enable the option to display categories a post belongs to.

Limit of Categories in Block - Define the limit of categories in the block.

Display Tags - Tags help readers find all posts on the same topic.

Date Format - Choose how to display the publishing date. It can be either in the standard format or as the number of days passed since posting.

Width of image on Blog page — define the images' width to use on the blog pages.

Height of image on Blog page — define the images' height to use on the blog pages.

Enable 'Like' control — set 'Yes' to enable blog visitors to vote for posts on the frontend via likes or dislikes. It will help you to indicate which topics are more helpful and interesting for your readers.

Comments

Use Comments - Enable or disable comments on the frontend.

Automatic Approving - You can allow publishing comments immediately without approval or moderate them first.

Allow Guest Comments - Enable or disable guest comments.

Quantity of Recent Comments in Block - Define the number of comments that will be displayed in the 'Recent Comments' block.

Display Short Content for Recent Comments - If you enable this option, customers will see the beginning of recent comments in the block.

Display Date for Recent Comments - Set this option to 'Yes' if you'd like to show the date when a comment was left in the 'Recent Comments' block.

Attribute rel=“nofollow” for Links in Comment - If you select 'Yes', search engines will not follow links in comments. It is useful if someone posts spam comments with links to other sites.

Ask Email for Comment — make the Email field mandatory for new comments.

Ask Name for Comment — make the Name field mandatory for new comments.

Enable GDPR Consent — enable or disable the GDPR consent for comments.

GDPR Consent Text — specify the consent text with a link to the privacy policy page.

The module doesn't provide your store with a privacy policy. It should be created as a CMS page in the admin panel.

Recent Posts Block

Recent Posts Quantity in Block - Set how many posts will be displayed in the block.

Display Short Content - Select 'Yes' to allow your customers to read the beginning of posts.

Display Date - Choose whether you want to show the date when a post was published.

Display Image - Specify whether you want to show images in the recent posts block.

Image Width and Image Height - Specify an image size.

Tags

Tags are more specific than categories. They help visitors find posts on the topic they are interested in quicker.

Minimal Posts Number per Tag - Define the minimal quantity of posts that a tag should have.

Use 3D Cloud to Display Tags - Display tags as a 3D cloud.

To make tags more noticeable to visitors you can add a block with a 3D tag cloud to the main blog page and post pages. This is how a tag cloud looks on the frontend. More popular tags look brighter than the other to drive the readers' attention to the hottest topics.

3D Cloud: Height - Choose the height of the 3D cloud block (in pixels).

3D Cloud: Text Color - Input the HEX code of the color that will be applied to the most popular tags (they have a bigger size than other tags).

It's also possible to use a handy palette instead of the color codes.

3D Cloud: Tag Color for Less Used Tags - Define the color that will be applied to minor tags (they are of a smaller size than the popular ones).

3D Cloud: Tag Highlight Color - Choose the highlight color.

3D Cloud: Color Scheme - Choose a ready-made color scheme of the cloud that will suit your store design.

Social Buttons

Enabled - The option turns on/off social networks share buttons.

Networks - Choose networks where your customers will be able to share posts.

Frontend example. As you can see, the sharing buttons are displayed right under the article on each post page of the blog.

Look and Feel

Include - Select a color scheme for the icons displayed at the top of a blog post (the author, number of views, the Print button, etc.).

Notification of Added Comment

Fill in the settings in the block, and admin users will receive notifications after new comments are submitted.

At first, enable notifications. Then, specify the Sender and the Receiver fields.

Accelerated Mobile Pages

Enable this option to make mobile pages work fast. AMP pages load nearly instantly and offer smooth experience on any mobile screen.

Image - Choose a logo image to display on accelerated mobile pages. Allowed file types: jpeg, gif, png. Maximum file size: 2MB

Width/Hight - Specify logo width and height. Note, that it shouldn't exceed 180 х 60px.

Design - Configure color settings for tags, links, buttons, and footer displayed on accelerated mobile pages.

How does it work?

AMP is a feature that optimizes website pages and makes them fast-loading on mobile devices. It is possible due to the special algorithm that replaces any code with HTML. It allows to remove and replace tags in order to make the page as fast as possible.

Key features:

  • Pages are rendering extremely fast.
  • The extension applies AMP on mobile devices only. It doesn’t affect the desktop version.
  • The position in Google ranking is improved due to the better score in Google PageSpeed Insights.
  • It works properly on the Magento cloud as well.

Posts

Reach features of the extension allow you to create blog posts adding images, thumbnails and author details. Besides, you can optimize posts for search engines and thus increase leads traffic to the store.

To view, edit and create posts, please go to Content → Posts. A convenient grid displays all your articles. Discover mass actions to manage blog content faster. To submit a new entry, please click the 'Add Post' button in the upper right corner of the page.

Every post has three options: Edit and Duplicate.

Edit - If you want to make some changes in the post content, select this option or just click the post line.

Preview - Select this option to preview the post look and feel.

Duplicate - the feature is useful if you need to publish the same post in another store view, but want to change the content or translate it into another language.

For this example, we will edit one of the existing posts.

Edit and create posts

Create posts with an all-in-one intuitive live design editor. Create texts and complement them with advanced formatting, various fonts, images, lists, and tables. Preview the post look and feel, add tags, categories, and metadata.

Title - Specify the title of the post.

URL Key - Define an SEO-friendly URL for the post.

Post Image - Choose an image that will be displayed in the post.

Post Image Alt - Specify an alternate text for a post image to be shown when a user for some reason cannot view it.

List Image - Choose an image that will be displayed on the main blog page.

if you add only one image, it will be displayed for both list and post.

List Image Alt - Specify an alternate text for a list image. A title of the post will be used if this field is empty.

Image Link - You can insert a link to an internal page in your store or to another website.

Full Content - Write the actual post in this field.

With the help of WYSIWYG editor tool, you can quickly format text, change fonts, add images, videos, create lists, tables, etc.

Short Content - Write a short description or summary of the post. It will be displayed on the main page as a preview for the post.

Tags - Specify the tags that are related to the post topic. If you used a tag once in the past, it will be autocompleted. Find out about how to create a tag in this section.

Preview - Preview the post look and feel before publishing.

Add Related Posts - Choose this option to add posts related to the article. Readers will be able to see them right on the post page they are currently viewing.

Status - Select the status of the post.

- Published - The post is displayed on the frontend.

- Disabled - The post is not displayed on the frontend.

- Hidden - The post is not enabled but you can see how it will look in the frontend. For this, click the link above the post that will appear after saving. We recommend you to set this status until the post is ready for publishing.

- Scheduled - The post will automatically be published at the time that you define in Publish Date field.

Categories - Select a category or categories the post will be published in.

Author - Choose the author from the list.

Posted From - Select the store view from which the post will be published.

Allow Comments - Select 'Yes' if you want to allow customers to leave comments to the post.

Mark as Featured - Select 'Yes' if you want to pin a post at the top of the blog page and to draw more readers' attention to it.

Here you can also see the post’s views counter. It shows the number of times each post was viewed on the frontend

Meta Data - Metadata, which includes meta title, meta description, and meta tags, helps search engines to correctly analyze what your post is about.

Meta Title - Specify the meta title of the post.

Meta Tags - Write keywords and phrases by which visitors can find the post in search engines.

Meta Description - Add a brief description of the topics, which are covered in the post.

When you finished editing a post please, save the changes.

Manage blog categories

Categories are aimed to help readers easier navigate in your blog and find the necessary posts faster. To access the existing categories, please go to Content → Categories. You can view the current blog categories with their main parameters on the grid. You can create a multi-level category tree and assign blog posts in the subcategory. Use the 'Edit' action to make the needed changes or click the 'New Category' button to create a category.

For this example we will edit the existing category; you would go through the same steps to create a new one.

{{ :magento_2:blog-pro:edit-category.png?nolink |

Name - Specify the category title.

Url Key - Specify the category URL.

Sort Order - The sort order of a category is defined automatically. If necessary, you can change it.

Status - enable or disable the category.

Visible In - Choose the store views where the category will be displayed.

Parent Category - Choose the parent category if any or select 'Root Category'.

In the Meta Data tab, you can specify a meta title, tags, and description. They will allow search engines to index the category better.

Meta Title - Specify the meta title of the category.

Meta Tags - Write keywords and phrases by which visitors can find the category in search engines.

Meta Description - Add a brief description of the topics, which are covered in all posts of the category.

Remember to click the 'Save' button when you are done.

See how the list of categories will look on the frontend.

Manage blog tags

To view all the tags that are used in your blog, please go to Content → Tags. There you can view all the tags you have with their main parameters on a convenient grid. Click on the tag to edit it and use the 'Add Tag' button to create a new tag.

For this example we will edit the existing tag; you would go through the same steps to create a new one.

Name - Specify the name of the tag.

Url Key - Define the URL key for the tag.

In the Meta Data tab, you can specify a meta title, tags, and description. They will allow search engines to index the tag better.

Meta Title - Specify the meta title of the tag.

Meta Tags - Write keywords and phrases by which visitors can find the tag in search engines.

Meta Description - Add a brief description of the topics, which are covered in all tagged posts.

Tagged Posts - In this tab, you can view all the posts that are marked with the chosen tag.

When you finished editing a tag, please, save the changes.

Comments

Comments are a necessary part of every blog. With their help, you can communicate with your visitors and learn their opinion on the topics you cover.

All blog comments are displayed on the backend. To view, approve or edit them, please go to Stores → Configuration → Amasty Blog Pro → Comments.

To edit a comment or change its status, select the Edit option in the Action dropdown or just click the comment line. You can also approve, reject, reply or delete a comment right from the grid. On the comment page, you can change the customer name, email, comment content, status, and store view.

This is how comments are displayed on the frontend, right under the post and the sharing buttons.


Authors

Share the joy of creating interesting content with other users. Let them publish posts alongside you and provide visitors with the author's introduction by adding social media links to their individual Facebook and Twitter pages. Manage all authors in a special grid.

Easily add new authors and edit their information.

Name - Specify the author's name.

URL Key - Specify the author's URL.

Facebook Profile - Add social media link to the author's individual Facebook page.

Twitter Profile - Add social media link to the author's individual Twitter page.

In the Meta Data tab, you can specify a meta title, tags, and description. They will allow search engines to index the author (and hence your posts) better.

Meta Title - Specify the meta title.

Meta Tags - Write keywords and phrases by which visitors can find the blog posts of the author in search engines.

Meta Description - Add a brief description of the topics, which are covered in the blog posts of the author.

When you finished editing a piece of author information please, save the changes.

Widgets

Do you want more visitors to know about your blog? Spread the necessary information via widgets. With the extension, you can add the Blog Category, Blog Recent Posts, Recent Comments widgets to any page of your website.

Please, go to Content → Widgets → Add Widget button to create a new widget.

Blog Category Widget

Choose this type of widget to display the posts categories in your blog.

On the Settings tab, select the Amasty Blog Category Widget in the Type field. Then, choose the desired design theme in the corresponding field and press the button Continue.

On the Storefront Properties tab, give a title to your widget in a Widget Title field at first. Then, choose the stores in which the widget should be available in the Assign to Store Views field. You can also specify the Sort Order when needed (when you have several widgets in the same container).

After these steps are completed, hit the Add Layout Update button. In the Display on dropdown, choose the page to place the widget on and specify the required additional information below.

Proceed to the Widget Options tab. Here, you can specify the header text, define the categories limit in the same name field. All these fields are optional.

When everything is completed, hit the Save button.


Blog Recent Posts

Use the widget to display the recent blog posts.

To do this, on the Settings tab:

  • choose the Amasty Blog Recent Posts in the Type field;
  • define the Design Theme you want to use;
  • click the Continue button.

On the Storefront Properties tab:

  • specify the widget title (the Widget Title field);
  • define the store views, to which you want to assign the widget (the Assign to Store Views field);
  • determine the sort order in case of need (the Sort Order field);
  • press the Add Layout Update button. Now, choose where you want to display the widget.

Switch to the Widget Options tab, where:

  • specify the header text and the posts limit in the same name fields (if needed);
  • enable/disable the Show post images in the widget view;
  • determine, whether to show the dates of the recent posts and choose the date format (the Show Date for Recent Post and the Date Format fields);
  • enable the Show Short Content for Recent Posts field if you want to display the short content for posts in the widget;
  • choose the needed post categories and post tags in the Post Categories for the Widget and the Post Tags for the Widget fields accordingly.

When completed, press the Save button.


Recent Comments Widget

With the widget, you can show to visitors the recent comments to your posts.

To create the widget, first, select Amasty Recent Comments Widget in the Type field and specify the Design Theme. Click Continue.

On the Storefront Properties tab, fill in the Widget Title, the Assign to Store views and the Sort Order fields. Then, hit the Add Layout Update button and customize the widget placement settings.

Open the Widget Options tab. Specify the Header Text and define the maximal number of comments in the widget in the Comments Limit field (optional). Then, choose whether to show date for recent comments, in the corresponding field.


Add Widgets to Pages and Blocks

To add widgets to pages or blocks, please, go to Content → Pages or Content → Blocks.

Choose the required page or block and click to edit it (or create the new one).

Here, on the Content tab in the Show Editor mode, click the Insert Widget button. Then you will need to configure the settings the same way as for the new widget.

Import from WordPress

With Magento 2 Blog extension you can easily transfer all the posts, comments, tags, authors and media files from WordPress to your Magento installation and comfortably manage your store and your blog in one place. To do this, go to Content → Import:

Fill in the following fields: Database Name, Database User Name, Database Password, Database Host, Table Prefix.

Allow Update Content on Existing URL-key - Set 'Yes' to allow content updates on posts with existing URL-key. Choose 'No' to add a new post.

Assign related products to your blog articles in cross-promotional purposes. Add Magento 2 Automatic Related Products and easily choose products to be displayed in a catchy widget on each post page.

Cron Tasks List

To check if cron generates and processing tasks and detect all cron execution errors in one place, please go to System → Cron Tasks List.

On a separate grid, you can see a job code, its status, the date each job was created, scheduled, executed and finished.

Run all cron tasks and generate their schedule by clicking the Run Cron button. Also, Delete separate tasks in bulk via Actions dropdown menu. Apply filtering and sorting options if needed.

Magento 2 Blog Pro extension is compatible with Porto theme.

Magento 2.3 Page Builder

If you have Magento 2.3 Page Builder module, use the Composer to make it compatible with Magento 2.3 Blog Pro. The necessary package can be installed with composer require amasty/blog-page-builder command.


Find out how to install the Blog Pro extension for Magento 2 via Composer.
Rate the user guide
 stars  from 6 votes (Details)
magento_2/blog_pro.txt · Last modified: 2019/11/13 13:03 by arhipenko