• Ruthy Licht

  • January 17, 2020 11:21

  Thank you so muchModeratorWes!

  Just to let you and everyone know- this still works on the current version. Thank you for this you saved me :)

• ModeratorWes

  • January 17, 2020 20:08

  

  Ruthy Licht- Glad to hear this helped your additions to your Help Center. Best of luck to you. You can find my other guidehere.

• Boby Bravo

  • January 25, 2021 07:08

  Thanks for the code. Anyway that this could be modified to work for the entire link as opposed to just an icon inside the box? I would like to make the rectangle PNG the only thing that appears without the extra wide borderonline. I currently went from the 2 columns to just 1 column and would love to be able to go back as well. Any help would be appreciated!

• Rob H.

  • January 25, 2021 20:22

  Bobby- I remember seeing something similar to your ask a couple years ago but this is the closest I can find now:Add a background image on the category blocks

• Donald Cornel

  • March 04, 2021 04:00

  Hello,

  Can someone here has tried to make it 4 items per row?

  Because I think the max by default is 3 only.

  Thanks.

• Antwon Davis

  • March 29, 2021 15:06

  Hi, we've tried to add our icons to our Help Center and it's not working. I've looked all over this forum and can't figure out exactly where this code needs to be added and if the code we're using is correct. Can someone tell us which file and where this code needs to be added? And is the code below written correctly?

  {{#each categories}}
  

  
  
  {{#is name 'Account Management'}}
  
  {{/is}}
  {{#is name 'How to Guides'}}
  
  {{/is}}
  {{#is name 'Devices and Apps'}}
  
  {{/is}}
  {{#is name 'Troubleshoot'}}
  
  {{/is}}
  

  {{name}}

  
  

  {{excerpt description}}

  
  
  

  
  {{/each}}

• Bruce Michelsen

  • April 01, 2021 17:17

  You can add images to the categories on the home page by editing the home_page.hbs template file. Look for the

  inside the {{#each categories}}, then add your code for adding images.
  For example, here's an excerpt from my code. (Note that I'm using is id instead of is name.)

  
  
  
  {{#是360002010174号id}} {{!——开始——}}
  
  {{/is}}
  ...

• Antwon Davis

  • April 01, 2021 18:08

  Thanks Bruce. We were able to get the icons on the homepage. Now we're trying to figure out how to fix the size of the icons. They're all stretched and pixelated. Does anyone know exactly where we need to go to edit the code to fix the sizing? And what's an example of the code to use?

• Bruce Michelsen

  • April 01, 2021 20:41

  Sizing can be done using the style.css file. In my example, I used class="home-page-images". Edit the style.css and search for that. Then you can set width and height. For example:

  .home-page-images {
  width: 128px;
  height: 128px;
  }

• Antwon Davis

  • April 01, 2021 20:45

  Ok. I'm searching now. "home-page-images" doesn't exist currently in the style.css. Are you saying to just add it?

• Bruce Michelsen

  • April 01, 2021 20:49

  Just add it in. (I couldn't remember if it's a theme default or one I added.)

• Antwon Davis

  • April 01, 2021 21:02

  I've added the code and it didn't change anything. See screenshots below.

  

  

• Bruce Michelsen

  • April 01, 2021 21:30

  Are you setting the class="home-page-images" where you specified the image?

• Marius

  • April 21, 2021 07:57

  Hi,

  I'm also trying to add icon to the categrory and used the code provided by@...but it doesn't work.

  I receive this error:

  1 error

  .. {{/ `if` }} .. is not permitted in this context in line 38

  Here is the code that I'm using in home_page.hbs

  {{ help_center.name }}

  
  

  
  

  {{ t 'search' }}

  
  
  
  
  
  {{search submit=false instant=settings.instant_search class='search search-full'}}
  

  
  

  
  

  
  

  
  

  
  {{#each categories}}
  {{#if ../has_multiple_categories}}
  
  • 
    {{#is name 'Delivery'}}

  
  {{else}}
  {{#each sections}}
  
  • 
    
    

    
    {{name}}
    {{#if internal}}
    
    {{/if}}
    

    
    

    {{excerpt description}}

    
    
    
  
  {{/each}}
  {{/if}}
  {{/each}}
  

  
  {{pagination}}
  

  {{#if promoted_articles}}
  

  
  

  {{t 'promoted_articles'}}

  
  

  
  {{#each promoted_articles}}
  
  • 
    
    {{title}}
    
    
  
  {{/each}}
  

  
  

  
  {{/if}}
  

  {{#if help_center.community_enabled}}
  

  
  

  {{t 'community'}}

  
  {{#link 'community' class='community-link'}}
  {{t 'join_conversation'}}
  {{/link}}

  
  

  
  {{/if}}

  
  {{#if settings.show_recent_activity}}
  {{recent_activity}}
  {{/if}}
  

  
  

  I hope someone can help me with this issue ;) Thanks.

• Bruce Michelsen

  • April 21, 2021 16:03

  Make sure you close the is statement:

  {{#is name 'Delivery'}}
  
  {{/is}}

• Marius

  • May 04, 2021 09:59

  Bruce Michelsen,
  
  Thank you so much!

  It's working now

• Marius

  • May 04, 2021 11:16

  HiBruce Michelsen,

  I actually have another issue now with the icon after using your code to limit the size. Now the icon in not in the center anymore:

  

  .home-page-images {
  width: 128px;
  height: 128px;
  }

  Any idea why and how to fix it?

• Marie-Cathrine

  • May 04, 2021 12:54

  Community Moderator

  Hi@...,

  Try adding:

  align-items: center;

  to the .blocks-item-link class in the CSS. This should center the image.

  #helpsome regards,
  Marie-Cathrine Sørensen
  Developer @ helphouse.io

• Marius

  • May 04, 2021 13:24

  Hi Marie,

  Thank you for your help!

  Cheers,

  Marius

• Thomas Anderson

  • September 30, 2022 08:26

  Hi all,

  I'm having issues with this and must be missing something obvious (apologies, I'm no expert).

  I've added what I believe is the correct code and linked my asset but when I hit preview no image is added.

  Any idea what I'm missing?

  
  

  
  {{search submit=false instant=true class='search search-full'}}
  

  
  

  
  

  
  

  
  

  
  {{#each categories}}
  {{#if ../has_multiple_categories}}
  
  • 
    
    {{#is name 'CRi-Pro'}}
    
    {{/is}}
    
    

    {{name}}

    
    

    {{excerpt description}}

    
    
    
  
  {{else}}
  {{#each sections}}
  
  • 
    
    

    
    {{name}}
    {{#if internal}}
    
    {{/if}}
    

    
    

    {{excerpt description}}

    
    
    
  
  {{/each}}
  {{/if}}
  {{/each}}
  

  
  {{pagination}}
  

  {{#if promoted_articles}}
  

  
  

  {{t 'promoted_articles'}}

  
  

  
  {{#each promoted_articles}}
  
  • 
    
    {{title}}
    
    
  
  {{/each}}
  

  
  

  
  {{/if}}
  

  {{#if help_center.community_enabled}}
  

  
  

  {{t 'community'}}

  
  {{#link 'community' class='community-link'}}
  {{t 'join_conversation'}}
  {{/link}}

  
  

  
  {{/if}}

  
  {{recent_activity}}
  

  
  

• Greg Katechis

  • September 30, 2022 17:07

  Zendesk Developer Advocacy

  Hi Thomas! I'm not immediately seeing anything obvious as the issue. Is the category name and/or asset spelled correctly? Are you seeing any errors in the editor?

• Thomas Anderson

  • October 05, 2022 11:33

  Hi Greg,

  Thanks for the quick reply!

  I'm glad there's nothing obvious that I'm missing. I'm using the copy/paste feature of the asset library to avoid typos and I don't see any errors - although perhaps I don't know what I'm looking for. There are no pop-up errors certainly.

• Kevin Froleiks

  • November 30, 2022 22:39

  Incredibly helpful! Thank you!

Pleasesign into leave a comment.