Show All Article In Home Page | Community
Skip to main content

Show All Article In Home Page

  • June 21, 2022
  • 3 replies
  • 0 views

Anis

Can i show all Article in home page? or I just can see 6 Article in my home page?

I have Category Music , and inside the category i have 20 article . i want to show all my article in home page without "see all article" if it has brought up 6 Article.

Any solution of this ?

Thank you 

3 replies

Ifra
  • June 28, 2022

Hi Anis F,  

To show all articles on homepage, follow the below steps:-

i). Add the given code to your script.js file.

 $(document).ready(function(){
  $.getJSON('/api/v2/help_center/categories/4404022102548/articles', function (data) {
      var articleList = '';
      $.each(data.articles, function (idx, itm) {
        articleList += '<li>';
        articleList += '<a href="' + itm.html_url + '" id="' + itm.id + '">' 
        + itm.title + '</a>';
        articleList += '</li>';
      });
      $('ul.articles-list').html(articleList);
      var articlesLength = $('ul.articles-list > li').length;
      if (articlesLength) {
        $('.articles-list').show();
        
      }
   });
})



Note:- Remove my category-id '4404022102548' from the API and add your category-id of 'Music'. Click on the category you will redirect to the category page and then copy the category id from the search-bar of your window see in the given screenshot. There is number in the search-bar, copy that id and paste it to the API.





Screenshot:


 

 

ii). Add the given code to your homepage.hbs file.

<div class="articles_list">
  <h3>Articles List</h3>
  <ul class="articles-list">
  </ul>
</div>



Screenshot:

 

 

iii). Make sure your document_head.hbs file must has jQuery CDN.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

 

 

If any issue feel free to ask :)

Thanks


raphael12
  • December 20, 2022

@ifra it works perfectly 😃 😀 😄 


Ifra
  • December 21, 2022

Thanks Raphael ! :)