Public Forums 71,145 posts

[obiettivospiagge Friend obiettivospiaggeJoin date: November 2015Posts: 12Downloads:28Uploads:1 Thanks: 2]

#963380

Hi, I need to ad text on the right side of the logo

Thanks

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#963851

@obiettivospiagge

You can access Backend > Extensions > Templates > select Simpli template style > Advanced tab > Add text in Description field as you wish.

Then go to file: ROOT/templates/ja_simpli/css/custom.css and add this rule:

.navbar-brand .slogan {
    display: inline-block;
    margin-left: 15px;
}

[obiettivospiagge Friend obiettivospiaggeJoin date: November 2015Posts: 12Downloads:28Uploads:1 Thanks: 2]

#965456

How I can allign the text with logo?
Is possible to sho the text on one line?

Best regards

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#965865

You can post your site’s URL here so we will have a look.

[obiettivospiagge Friend obiettivospiaggeJoin date: November 2015Posts: 12Downloads:28Uploads:1 Thanks: 2]

#967362

http://demo.coreimaging.eu/museodiffuso/index.php/it/

I would like that the title "Museo Diffuso Albisola" is allign to the logo

Best regards

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#967472

The current width of the header-left block is not enough to display logo + slogan on your site. You can access Backend > Extensions > Templates > select JA Simpli style > Layout configuration and change the block width: http://prntscr.com/cgye3z (you can change to 7 for example)

Then open the ‘custom.css’ file where you add your custom change in css and remove the margin-left property:

.navbar-brand .slogan {
    display: inline-block;
    text-align:top;
    /* margin-left: 150px; */
    font-size: 24px;
    text-transform:none;
}

Now, the slogan will stand next to the logo, if you want they are closer, you can reduce the width of the logo a bit:

a.logo strong {
    width: 200px;
    height: 100px;
}

Hope this helps.

1 user says Thank You to Saguaros for this useful post

1. rn3ant

[Author]

Posts