Category Icon align

Hi @goncalonunogarcia ,

Currently, we don’t have this control from BetterDocs settings but you can add this CSS on your stylesheet and see if it works or not:

.betterdocs-wraper .betterdocs-category-list .docs-cat-title-inner, .docs-cat-title, .docs-cat-title .docs-cat-heading {
    flex-direction: row-reverse;
    padding: 10px;
}

You can simply add custom CSS by navigating to your WordPress Dashboard -> Appearance -> Customize.
After you are on the Customizer page, search for the “Additional CSS” option. You can then go ahead and insert CSS Code.

Thank you!

Hi

thanks, it is almost waht i want. But I need the text aligned to left and the icon in the right
like this sketch: https://ibb.co/1LGxsnw

Hi @goncalonunogarcia,

Hope you’re doing good.

Actually, we don’t have the option to do so. But you can do it by applying some custom code. As per your query, I assume you don’t need the Item Counter. So, Please apply the custom CSS below.

.betterdocs-wraper .betterdocs-category-list .docs-cat-title-inner {
  display: block !important;
}

.betterdocs-wraper .betterdocs-category-list .docs-cat-title-inner, .docs-cat-title, .docs-cat-title .docs-cat-heading {
  flex-direction: row-reverse !important;
  padding-left: 0 !important;
  justify-content: space-between !important;
}

.betterdocs-wraper .betterdocs-category-list .docs-item-count {
  display: none !important;
}

Note: You can simply add custom CSS by navigating to your WordPress Dashboard -> Appearance -> Customize.
After you are on the Customizer page, search for the “Additional CSS” option. You can then go ahead and insert CSS Code.

Please check this screencast to learn more – https://d.pr/v/QrrfTw

This is the final look from my end: https://d.pr/i/fgPhcB

Hope it helps. Let me know how it goes.

Thank you!

Hi

Thanks a lot
Almost perfect.
I just need a last tweak. How can the category title be align with the docs list?
https://ibb.co/mNdsMzh

Hi @goncalonunogarcia,

I hope you are doing well.

You can add this Custom CSS on your stylesheet and see if it works or not:

.docs-cat-title-inner .docs-cat-heading {
  padding-left: 45px!important;
}

Let me know how it goes. Thank you!

Thanks

It worked

How can I make so this changes dont affect the formating in the sidebar category list, so the icon in te sidebar category list appears in the left of the title

Hello @goncalonunogarcia,

I am glad to know it worked. And It’s actually hard to assume the present look of your sidebar category. You can share a screenshot as you work on a local setup. So that I can understand and provide you a solution.

Thank you!

Hu again

front page (is ok): https://ibb.co/K6DMmn0

sidebar category list https://ibb.co/yfS1Yv3

Hello again,

You can add this Custom CSS on your stylesheet and see if it works or not:

#betterdocs-sidebar .betterdocs-sidebar-content .betterdocs-categories-wrap .docs-single-cat-wrap .docs-cat-title-wrap .docs-cat-title-inner .docs-cat-title .docs-cat-heading {
    margin-left: -30px !important;
}

Let me know how it goes. Thank you!

Hi

The issue remains. I see no changes.

Hello @goncalonunogarcia,

I hope you are doing good.

Actually the Custom CSS I have given you in my last reply worked fine on my end. Please check this screencast – https://d.pr/v/d9Udk0

As you didn’t provide any webpage URL, Maybe I couldn’t get the right CSS Class for you. But you can try to implement it once again.

You can simply add custom CSS by navigating to your WordPress Dashboard -> Appearance -> Customize.
After you are on the Customizer page, search for the “Additional CSS” option. You can then go ahead and insert the CSS Code.

Please check this screencast to learn more – https://d.pr/v/QrrfTw

Thank you

Hello @goncalonunogarcia,

Greetings. Hope you are doing well.

I haven’t heard from you since then. So, I was wondering if your issue has been resolved or not. Please let us know. I wish you a good day.

Thank you

Hi

Still not working. please check this screenshot https://ibb.co/7n7nn17

Hello @goncalonunogarcia,

I can see your category list title is placed as expected. Can you please clearly share your expectation again? So that I can share a solution to fix your issue.

Thanks in advance!

Hi

I need the category icon to appear before the category name. But keeping, on the home page, in the categories grid, the icon aligned to the right and the name to the left.

Thanks in advance