Support Forums

Support Online : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Decora - how to bring logo in a bit from the left hand side

Featured Lock Resolved Issue
Hi there, Does anyone know how to create a margin to the left of the top section so that logo is not so close to the left hand side?

Attachments (1)

  • Capture.JPG
    Capture.JPG 30.2 KB

10 Answers

Paul Frankowski - Staff

4 weeks ago #Permalink
Hi,
Did you use text logo instead of graphic one?
If yes, this should help

#sp-header .logo {padding-left: 20px;}

Check and let me know.
----
Helix Ultimate Documentation - How to use custom code
Hi,
Did you use text logo instead of graphic one?
If yes, this should help

#sp-header .logo {padding-left: 20px;}

Check and let me know.
----
Helix Ultimate Documentation - How to use custom code

Thanks for your help Paul. Yeah I'm using text just now until client comes back to me with graphics. Where do I insert that code?

Is there any way to bring the menu along top in, so that it is something like 800 wide? Dont really want it spanning the full screen width.

Paul Frankowski - Staff

4 weeks ago #Permalink
Helix Ultimate Documentation - How to use custom code

Yes, in Helix settings.

Attachments (1)

  • custom_css.png
    custom_css.png 7.2 KB

Paul Frankowski - Staff

4 weeks ago #Permalink

Is there any way to bring the menu along top in, so that it is something like 800 wide?

NO default settings, extra custom CSS must be added/used.
Hi there, I added this to the custom code section of the Helix set up within the template, but that just seems to push the logo section along a bit and condenses it into the menu.

Is there a way to contain all the items (logo, main menu and top menu) within the middle part of the top of the template, for example in between the thick bars in the attached marked up screenshot?

Attachments (1)

  • Capture.gif
    Capture.gif 199.3 KB

Paul Frankowski - Staff

4 weeks ago #Permalink
Do you want to reduce header width, to have, for example, max 900px?
If yes try:

#sp-header .container-fluid {max-width: 900px;}


Notice! There can be no space for the menu if the content of the header would be too narrow.
It means that you have to use imagination with max-width value.

900px.jpg

Attachments (1)

  • 900px.jpg
    900px.jpg 111.1 KB
Thanks Paul, really appreciate your help. That works great, thanks. Just one last question, is there a way to align the menu to the right of the topbar?

Also is there documentation to go with the template?

Many thanks, Gavin

Paul Frankowski - Staff

4 weeks ago #Permalink
Documentation is basic, doesn't include all possible customizations. Is not possible to include all "unusual" wishes.
--
Topbar? Topbar is above header. And in the header, you have menu + logo.
Yes.
Check template documentation (I added a new section: Customising Decora Design )
This is great help, thank you. Worked a treat.


There are no replies made for this post yet.
However, you are not allowed to reply to this post.

Leaderboard (30 days)

Sifat

Sifat

Total Accepted Answers: 117
Paul Frankowski

Paul Frankowski

Total Accepted Answers: 91
Toufiq

Toufiq

Total Accepted Answers: 32
Pavel

Pavel

Total Accepted Answers: 3
Al Mamun

Al Mamun

Total Accepted Answers: 3

100+

Templates

200,000+

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us