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

More than a month 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

Gavin Esslemont

More than a month 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

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

More than a month 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

More than a month 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.

Gavin Esslemont

More than a month ago #Permalink
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

More than a month 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

Gavin Esslemont

More than a month ago #Permalink
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

More than a month 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 )

Gavin Esslemont

More than a month ago #Permalink
This is great help, thank you. Worked a treat.


There are no replies made for this post yet.
Be one of the first to reply to this post!

Leaderboard (30 days)

Sifat

Sifat

Total Accepted Answers: 119
Paul Frankowski

Paul Frankowski

Total Accepted Answers: 108
Toufiq

Toufiq

Total Accepted Answers: 89
Kamruzzaman Alam

Kamruzzaman Alam

Total Accepted Answers: 3
FUTURECLIENT

FUTURECLIENT

Total Accepted Answers: 2

115

Templates

296056

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