Website Design & Development Company - Pune, India.

How to display recent blog posts on Home page in Magento
19May

How to display recent blog posts on Home page in Magento

by Urvashi   |   19 May, 2016

1. Log into your Magento admin panel and navigate to CMS -> Widgets option:

2. Click on Add New Widget Instance button. In the Type* field, select Blog: Latest Posts|.

3. In Design Package/Theme field, select default/themeXXX.

4. Click Continue button. Specify Widget Instance Title, for example: Blog.

5. Select the desired Store View for which you wish to assign this widget. In the Sort Order field, type in the number 30.

6. Scroll down and click on Add LayoutUpdatebutton. In the Display on* field, select Specified Page option.

7. In the Page* field, select CMS Home Page.

8. In the Block Reference* field, select AW Blog Footer position:

9. Scroll up the page and click on Widget Optionstab on the left hand side.

10. Specify the number of blocks to show and select the Category to display:

11. Click on Save button to save your changes. Once that is done, you can add/edit/manage your posts.

12. Navigate to Blog -> Posts menu:

13. Click on Add Post button:

14. Add a title and identifier for your post, select your store view and category.

15. Edit your Short Content field – this will be displayed on your Home Page. Edit your Content field – this will be displayed on your post.

16. Save your changes by clicking on Save Post button on top of the page:

17. You may also add Categories in Blog -> Categories option:

18. And edit Settings in Blog -> Settings option:

If you have to add blog without Widgets option i.e, with your themes default widgets  then just goto the Magento Admin panel

Blog->Add post->

After click on Add post you have one screen with title categories and all the other things. You can have general category by default but, if you want to change you can change the category Just goto Blog->Categories and then click on Add New button which is present on right top corner and add new category, Then again goto the Blog->Add post-> fill all the details with given data like add the blog text with proper images.

Note: Sometimes your theme gives you default widget if not then you have to create a widget as above mentioned.
 

Share
input:focus, select:focus, textarea:focus { border-color: ##1abc9c; } a { color: ##1abc9c; } .radio i, .checkbox i { color: ##1abc9c; } .radio i:before { background-color: ##1abc9c; } .button, .btn-default { border-color: ##1abc9c; background-color: ##1abc9c; } .button:hover { color: ##1abc9c; } .page-header-top { background-color: ##1abc9c; } .page-header-bottom-alt { background-color: ##1abc9c; } .page-intro:after { background-color: ##1abc9c; } .page-intro:before { background-color: ##1abc9c; } .page-content-section-bg { background-color: ##1abc9c; } .page-content-section-bg:before { background-color: ##1abc9c; } .page-content-section-border { border-top-color: ##1abc9c; } .page-footer { background-color: ##1abc9c; } .block-head-1 { border-bottom-color: ##1abc9c; } .block-head-1 i { background-color: ##1abc9c; } .block-head-2:after { background-color: ##1abc9c; } .block-head-2 i:after, .block-head-2 i:before { background-color: ##1abc9c; } .block-head-3 { border-bottom-color: ##1abc9c; } .block-head-3 i:after { background-color: ##1abc9c; } .block-head-4:after { background-color: ##1abc9c; } .block-head-7 { border-bottom-color: ##1abc9c; } .block-head-7:after { background-color: ##1abc9c; } .page-content-section-bg .block-head-3 i { color: ##1abc9c; } .main-search button { color: ##1abc9c; } .main-search button:after { background: ##1abc9c; } .main-nav li a { color: ##1abc9c; } .main-nav li a:before { background-color: ##1abc9c; } .main-nav li ul { background-color: ##1abc9c; } .main-nav li li:hover > a, .main-nav li li.active > a, #block-newsletter-newsletter-subscribe .form-submit:hover, .block-product-details .add-wishlist .button-alt:hover, .block-product-details-2 .add-wishlist .button-alt:hover { color: ##1abc9c; } .main-nav .switcher { border-color: ##1abc9c; background-color: ##1abc9c; } .main-nav .mega > div { background-color: ##1abc9c; } #block-newsletter-newsletter-subscribe .form-submit, .btn-primary:hover, .btn-primary:focus, .btn-primary:active { border-color: ##1abc9c; background-color: ##1abc9c; } .art-portfolio ol li.active, .ui-slider-horizontal .ui-slider-handle, .ui-slider-horizontal .ui-slider-range, .btn-primary.link { background-color: ##1abc9c; } .btn-primary, .button:hover, .btn-default:hover, .btn-default:focus, .btn-default:active { border-color: ##1abc9c; color: ##1abc9c; } .btn-primary.link:hover, .btn-primary.link:focus, .btn-primary.link:active { color: ##1abc9c; } } @media screen and (max-width: 767px) { /* phone */ .main-nav ul { background-color: ##1abc9c; } .main-nav li a { color: #ecf0f1; } .main-nav li ul { background: #e9e9e9; } .main-nav li li { border-top-color: ##1abc9c; } .main-nav li li a { color: ##1abc9c; } .main-nav li li a:hover { background-color: ##1abc9c; color: #fff; } .main-nav li li ul { border-top-color: ##1abc9c; } .main-nav .mega ul li { border-top-color: ##1abc9c; } } .slider-revolution .fa:after { background-color: ##1abc9c; } .slider-revolution .title { border-top-color: 1px solid ##1abc9c; border-bottom-color: 1px solid ##1abc9c; } .slider-revolution .button-my { border-color: ##1abc9c; background-color: ##1abc9c; } .slider-revolution .button-my:hover { color: ##1abc9c; } .pagination-1 a:hover { border-color: ##1abc9c; color: ##1abc9c; } .pagination-1 .active, .pagination-1 .active:hover { border-color: ##1abc9c; background: ##1abc9c; } .pagination-2 a:hover { color: ##1abc9c; } .pagination-2 .active, .pagination-2 .active:hover { background: ##1abc9c; } .pagination-3 a:before { box-shadow: inset 0 0 0 1px ##1abc9c; } .pagination-3 .active:before, .pagination-3 .active:hover:before { background: ##1abc9c; } .pagination-4 a:hover { border-color: ##1abc9c; } .pagination-4 .active { border-color: ##1abc9c; background: ##1abc9c; } .pagination-5 a { border-color: ##1abc9c; background-color: ##1abc9c; color: ##1abc9c; } .block-benefits div:hover { border-color: ##1abc9c; background-color: ##1abc9c; } .block-benefits i { color: ##1abc9c; } .block-benefits-2 li i { color: ##1abc9c; } .block-benefits-2 .tabs a:hover { border-color: ##1abc9c; background-color: ##1abc9c; } .block-benefits-2 .tabs .active a, .block-benefits-2 .tabs .active a:hover { color: ##1abc9c; } .block-benefits-3 i { color: ##1abc9c; } .block-about .button { border-color: ##1abc9c; color: ##1abc9c; } .block-about .button:hover { background: ##1abc9c; color: #ecf0f1; } .block-about .owl-prev:hover, .block-about .owl-next:hover { color: ##1abc9c; } .block-about-2 .bar { background: ##1abc9c; } .block-about-2 .value { color: ##1abc9c; } .block-about-4 .owl-pagination div { border-color: ##1abc9c; background: ##1abc9c; } .block-about-5 .owl-prev, .block-about-5 .owl-next { display: inline-block; border-color: ##1abc9c; background-color: ##1abc9c; } .block-about-5 .owl-prev:hover, .block-about-5 .owl-next:hover { color: ##1abc9c; } .block-about-6 .icons a:hover { color: ##1abc9c; } .block-mission .year { background: ##1abc9c; } .block-mission .years a:after { border-bottom-color: ##1abc9c; } .block-recent-works ol li:hover { color: ##1abc9c; } .block-recent-works ol .active { border-color: ##1abc9c; background: ##1abc9c; } .block-recent-works .description { background: ##1abc9c; } .block-recent-works .description:before { border-right-color: ##1abc9c; } .block-recent-works-3 h3 { border-top-color: ##1abc9c; } .block-recent-works-3 .link { border-color: ##1abc9c; } .block-recent-works-3 .fancybox { background-color: ##1abc9c; } .block-recent-works-3 .owl-pagination div { border-color: ##1abc9c; background: ##1abc9c; } .block-recent-works-4:before { background: ##1abc9c; } .block-recent-works-4 .fancybox { background: ##1abc9c; } .block-recent-works-4 .owl-prev:hover, .block-recent-works-4 .owl-next:hover { color: ##1abc9c; } .block-recent-works-6 a:before { background: ##1abc9c; } .block-recent-works-6 .owl-prev, .block-recent-works-6 .owl-next { border-color: ##1abc9c; background: ##1abc9c; } .block-recent-works-6 .owl-prev:hover, .block-recent-works-6 .owl-next:hover { color: ##1abc9c; } .block-portfolio ol li:hover { color: ##1abc9c; } .block-portfolio ol li.active { border-bottom-color: ##1abc9c; } .block-portfolio ul .pic span:after, .block-portfolio ul .pic span:before { background: ##1abc9c; } .block-portfolio ul .pic span i { color: ##1abc9c; } .block-portfolio-2 ol li:hover { color: ##1abc9c; } .block-portfolio-2 ol li.active { background: ##1abc9c; } .block-portfolio-2 ul .pic:before { background: ##1abc9c; } .block-portfolio-2 ul .pic a { background: ##1abc9c; } .block-portfolio-2 ul .pic a:hover { color: ##1abc9c; } .block-portfolio-3 ol li:hover { color: ##1abc9c; } .block-portfolio-3 ol li.active { background: ##1abc9c; } .block-portfolio-4 h3 { border-top-color: ##1abc9c; } .block-portfolio-4 .link { border-color: ##1abc9c; } .block-portfolio-4 .fancybox { background: ##1abc9c; } .block-portfolio-5 ol li:hover { color: ##1abc9c; } .block-portfolio-5 ol li.active { background: ##1abc9c; } .block-portfolio-5 .info:before { background: ##1abc9c; } .block-portfolio-6 ol li:hover { color: ##1abc9c; } .block-portfolio-6 ol li.active { background: ##1abc9c; } .block-portfolio-6 ul a:before { background: ##1abc9c; } .block-portfolio-7 ol li:hover { color: ##1abc9c; } .block-portfolio-7 ol li.active { background: ##1abc9c; } .block-portfolio-7 ul li:before { background: ##1abc9c; } .block-portfolio-7 ul a:hover { color: ##1abc9c; } .block-portfolio-8 li div:before { background: ##1abc9c; } .block-portfolio-8 li a { background: ##1abc9c; } .block-clients .owl-prev, .block-clients .owl-next { color: ##1abc9c; } .block-testimonials-3 .carousel h3 { border-bottom-color: ##1abc9c; } .block-testimonials-3 .owl-pagination div { border-color: ##1abc9c; } .block-testimonials-3 .owl-pagination .active { background: ##1abc9c; } .block-testimonials-4 .owl-prev, .block-testimonials-4 .owl-next { border-color: ##1abc9c; background: ##1abc9c; } .block-testimonials-4 .owl-prev:hover, .block-testimonials-4 .owl-next:hover { color: ##1abc9c; } .block-services li a { border-color: ##1abc9c; } .block-services li a:hover { background-color: ##1abc9c; } .block-services-2 li a:hover { background: none; } .block-services-2 li a:after { box-shadow: inset 0 0 0 2px ##1abc9c; } .block-services-2 li a:hover:after { background-color: ##1abc9c; } .block-services-3 li a:hover { background: none; } .block-services-3 li a:after { box-shadow: inset 0 0 0 2px ##1abc9c; } .block-services-3 li a:before { background: ##1abc9c; box-shadow: inset 0 0 0 2px ##1abc9c; } .block-services-3 li a:hover:after { background-color: ##1abc9c; } .block-services-4 li a { border-color: ##1abc9c; } .block-services-4 li a:hover { background-color: ##1abc9c; } .block-services-5 li i { color: ##1abc9c; } .block-services-5 li i:hover { background: ##1abc9c; } .block-services-6 h3 span { color: ##1abc9c; } .block-services-6 li a { border-color: ##1abc9c; background: ##1abc9c; } .block-services-6 li a:hover { color: ##1abc9c; } .block-services-7 .info i { background: ##1abc9c; } .block-services-7 .carousel .active { background: ##1abc9c; } .block-services-7 .carousel .owl-prev, .block-services-7 .carousel .owl-next { border-color: ##1abc9c; background: ##1abc9c; } .block-services-7 .carousel .owl-prev:hover, .block-services-7 .carousel .owl-next:hover { color: ##1abc9c; } .block-pricing dt { color: ##1abc9c; } .block-pricing .price:before { background: ##1abc9c; } .block-pricing li:hover .inner { background: ##1abc9c; } .block-pricing li:hover .button { color: ##1abc9c; } .block-pricing li:hover .button:hover { background: ##1abc9c; } .page-content-section .block-pricing .inner { box-shadow: 0 0 0 1px ##1abc9c; } .block-pricing-2 dt { color: ##1abc9c; } .block-pricing-2 .price { background: ##1abc9c; } .block-pricing-2 .button { color: ##1abc9c; } .block-pricing-2 li:hover .inner { background: ##1abc9c; } .block-pricing-2 li:hover .button:hover { background: ##1abc9c; } .block-progress li i { border-color: ##1abc9c; color: ##1abc9c; } .block-team-2 .pic:before { background-color: ##1abc9c; } .block-team-2 .icons a { color: ##1abc9c; } .block-team-3 .pic:before { background-color: ##1abc9c; } .block-team-3 .icons a { color: ##1abc9c; } .block-team-3 .info h3 { color: ##1abc9c; } .block-team-list .pic span:after { background-color: ##1abc9c; } .block-team-list .icons a:hover { color: ##1abc9c; } .block-team-list .icons a:before { background: ##1abc9c; } .block-team-list .skills { border-top-color: ##1abc9c; border-bottom-color: ##1abc9c; } .block-team-grid .pic:before { background-color: ##1abc9c; } .block-skills i:before { background-color: ##1abc9c; } .block-skills .bar { border-color: ##1abc9c; background-color: ##1abc9c; } .block-skills-2 i:before { background-color: ##1abc9c; } .block-skills-2 .bar { border-color: ##1abc9c; background-color: ##1abc9c; } .block-capabilities h3 { color: ##1abc9c; } .block-capabilities-2 h3 { color: ##1abc9c; } .block-recent-posts .info { background-color: ##1abc9c; } .block-recent-posts-2:before { background-color: ##1abc9c; } .block-recent-posts-2 li .button { color: ##1abc9c; } .block-recent-posts-2 li .button:hover { background-color: ##1abc9c; } .block-recent-posts-2 .button-more { color: ##1abc9c; } .block-recent-posts-2 .button-more:hover { background-color: ##1abc9c; } .block-featured-posts .pic:before { background-color: ##1abc9c; } .block-blog-list .link { background: ##1abc9c; } .block-blog-list .date:before { background-color: ##1abc9c; } .block-blog-list .date-alt { background-color: ##1abc9c; } .block-blog-list .zoom { background-color: ##1abc9c; } .block-blog-grid .link { background: ##1abc9c; } .block-blog-grid .date:before { background-color: ##1abc9c; } .block-blog-grid .pic:hover .date { color: ##1abc9c; } .block-blog-grid .zoom { color: ##1abc9c; } .block-blog-details .date:before, .block-blog-details .reply:before, .block-blog-details .type:before { background-color: ##1abc9c; } .block-blog-details .date-alt { background-color: ##1abc9c; } .block-blog-details .share a:before { border-color: ##1abc9c; background: ##1abc9c; } .block-blog-details .share a:hover { color: ##1abc9c; } .block-blog-details .about:before { background: ##1abc9c; } .block-catalog-toolbar .view a:hover { border-color: ##1abc9c; color: ##1abc9c; } .block-catalog-toolbar .view .active, .block-catalog-toolbar .view .active:hover { border-color: ##1abc9c; background: ##1abc9c; } .block-catalog-toolbar .direction { border-color: ##1abc9c; background: ##1abc9c; } .block-catalog-toolbar .direction:hover { color: ##1abc9c; } .block-catalog-grid .pic:before { background: ##1abc9c; } .block-catalog-grid .badge { background: ##1abc9c; } .block-catalog-grid .price { color: ##1abc9c; } .block-catalog-grid .owl-prev, .block-catalog-grid .owl-next { border-color: ##1abc9c; background: ##1abc9c; } .block-catalog-grid .owl-prev:hover, .block-catalog-grid .owl-next:hover { color: ##1abc9c;; } .block-catalog-list .pic:after { background-color: ##1abc9c; } .block-catalog-list .badge:before { background-color: ##1abc9c; } .block-catalog-list .price { color: ##1abc9c; } .block-catalog-list .owl-prev, .block-catalog-list .owl-next { border-color: ##1abc9c; background-color: ##1abc9c; } .block-catalog-list .owl-prev:hover, .block-catalog-list .owl-next:hover { color: ##1abc9c;; } .block-product-details .price { color: ##1abc9c; } .block-product-details .button-alt { color: ##1abc9c; } .block-product-details-2 .button-alt { color: ##1abc9c; } .block-product-details-2 .share a:before { background-color: ##1abc9c; box-shadow: 0 0 0 2px ##1abc9c; } .block-product-details-2 .share a:hover { color: ##1abc9c; } .block-product-info .owl-prev, .block-product-info .owl-next { border-color: ##1abc9c; background-color: ##1abc9c; } .block-product-info .owl-prev:hover, .block-product-info .owl-next:hover { color: ##1abc9c; } .block-product-tabs .head .active { color: ##1abc9c; } .block-product-tabs .head .active:before { border-top-color: ##1abc9c; } .block-shopping-cart th { border-top-color: ##1abc9c; color: ##1abc9c; } .block-shopping-cart .price { color: ##1abc9c; } .block-shopping-cart .remove { border-color: ##1abc9c; background-color: ##1abc9c; } .block-shopping-cart .remove:hover { color: ##1abc9c; } .block-shopping-cart .quantity a { color: ##1abc9c; } .block-shopping-cart .empty td { border-bottom-color: ##1abc9c; } .block-shopping-cart-totals dd { color: ##1abc9c; } .block-shopping-cart-totals .button-alt { color: ##1abc9c; } .block-checkout-order td:last-child { color: ##1abc9c; } .block-checkout-payment label { color: ##1abc9c; } .block-welcome .icons i:after { border-color: ##1abc9c; background: ##1abc9c; } .block-welcome .icons a:hover i { color: ##1abc9c; } .block-pasteboard:before { background: ##1abc9c; } .block-pasteboard .icons a:hover { color: ##1abc9c; } .block-map-3 .block-head { color: ##1abc9c; } .block-contacts ul li:after, .block-contacts ul li:before { border-color: ##1abc9c; background-color: ##1abc9c; } .block-contacts ul li:before { background-color: #fff; } .block-contacts ul li span { border-bottom-color: ##1abc9c; } .block-contacts ul .active { color: ##1abc9c; } .block-contacts ul .active:before { background-color: ##1abc9c; } .block-contacts ol { border-top-color: ##1abc9c; } .block-contacts ol li { color: ##1abc9c; } .block-contacts ol li i:after { background-color: ##1abc9c; } .block-feedback .message i, .block-feedback-2 .message i { color: ##1abc9c; } .block-not-found h3 { color: ##1abc9c; } .block-not-found .pic:before { background-color: ##1abc9c; } .block-not-found .pic div:before { background-color: ##1abc9c; } .block-not-found-2 .button { color: ##1abc9c; } .block-not-found-2 .button:hover { background: ##1abc9c; } .block-coming-soon li:before { background-color: ##1abc9c; } .block-coming-soon-2 li:after { background-color: ##1abc9c; } .widget-categories a:hover, .widget-categories a.active { color: ##1abc9c; } .widget-top-posts a:hover { color: ##1abc9c; } .widget-text hr { border-top-color: ##1abc9c; } .widget-text em { color: ##1abc9c; } .widget-archive a:hover, .widget-archive a.active { color: ##1abc9c; } .widget-tags a:hover { color: ##1abc9c; } .widget-categories-filter a:hover { color: ##1abc9c; } .widget-categories-filter .active { color: ##1abc9c; } .widget-categories-filter .active span { background-color: ##1abc9c; } .widget-price-filter .ui-slider-range { background-color: ##1abc9c; } .widget-price-filter .ui-slider-handle { background-color: ##1abc9c; } .widget-color-filter .active:before { border-color: ##1abc9c; } .widget-top-products .pic i { background-color: ##1abc9c; } .main-nav ul { background-color: ##1abc9c; }