Greetings to all Members!

I'm a newbie in using Drupal to develop a website. I'm using the free Theme "Business" from DevSaran but I have the following difficulties:
1. I want to enlarge the width of the pages.
2. I want to push the sitename deeper, just below the main menu, and have in the middle.
3. I want to push the sitelogo more leftwards and more to the top of the website.
I tought this is possible by changing some code lines in the file "style.css" or in the generated files ending with "twig". But I could not succed unfortunately.
Can someone tell me how to achieve all this, please?
Many thanks for your help.
Best regards.

Kofi.

Comments

VM’s picture

you need to utilize your browser's inspector tool to determine what CSS is in use and therefore what to override. Never edit a themes files. Generate a subtheme with a custom.css file. Following this best practice ensure that you can update the theme if/when a new release is generated by the maintainer.

Jeff Burnz’s picture

Never edit a themes files. Generate a subtheme with a custom.css file.

Cloning and renaming a theme is often the better practise, especially if using a contrib theme, because if you take a contrib theme and sub-theme it the very next update to that theme could break your sub-theme (because of base theme/sub theme inheritance). Inheritance is not always a good thing.

Jeff Burnz’s picture

1. I want to enlarge the width of the pages.

use CSS, the width is always set with CSS.

2. I want to push the sitename deeper, just below the main menu, and have in the middle.

Your post is categorised as D7, but twig is Drupal 8. In Drupal 8, in most themes, the site name is in the branding block - move the block to a different region. You may need to create that region if one does not exist in your theme. In the branding block config turn off logo and site slogan.

3. I want to push the sitelogo more leftwards and more to the top of the website.

Logo is in the branding block, in D8 you can have more than one instance of a block, so you can place another instance of the branding block and turn off site name and slogan in that instance. Then use an appropriate region and/or use CSS to position it.

Fokofi’s picture

Hello Jeff!

Can you tell me how I can reduce the height of the header of the bartik theme in Drupal 8?

I'm using the bartik for my website and should like to reduce the height in order to make it more attractive when I integrate the site logo and the website name in it. The height should be about 45px.

I've tried it with "height=45px" within the <img> tag in the file "site-branding-block.html.twig", but it didn't bring anything.

Many thanks for your help.

Best regards.

Kofi

Fokofi’s picture

Hello everyone!

I'm using actually as a newbie the Bartik Theme for my website and should like to customize it by reducing the height of the Header.

Can someone  tell me which file(s) I need to customize.

I want to reduce the height to 45px to fit the logo and the site name.

Many thanks in advance for any help.

Kofi