[theme: pictorico] Replace text header with a logo image

I have my JetPack CSS editor and also I made a pictorico child theme with its own style.css (just learning in the process).

To avoid confusion, I’d suggest you use either the Jetpack CSS editor, or make changes in your child theme’s style.css, but not both.

I’m not seeing either your child theme or the Jetpack CSS module active on your site right now.

Your stylesheet is pointing to the parent theme at the moment?

<link rel='stylesheet' id='pictorico-style-css' href='https://www.rubiconproducciones.eu/wp-content/themes/pictorico/style.css?ver=4.0' type='text/css' media='all' />

Have you activated the Jetpack CSS module and saved any CSS there?

Hi, Kathryn.
Thanks for writing back and really nice to share this chat with you.
You are right, yesterday my Jetpack CSS editor just disapeared. And I think I typed something wrong in my style.css and everything blowed up. So I decided to come back to the parent pictorico theme.
Now I think I have my Jetpack CSS module activated in my child theme. I hope everything is fine. So I think I ready for further procedures acording to this issue.
Looking forward to hearing from you.
Mariano

Glad you got your Jetpack CSS editor working again. I see it active now, but the only bit of custom CSS in there is unrelated to adding a logo.

Could you now try following the guide Sheri (designsimply) posted in the other thread? Be sure to tweak the image file path to reflect the actual path of your own logo in your media library, and modify the sizes in the CSS as needed to fit your image.

I’ll have a look once you’ve added the code.

Hi, Kathryn.
It worked beautifully.
Later I can decide the size of the logo tweaking the figures. But meanwhile, I am happy my logo is there.
Just one more little detail.
How can I erase the vertical grey line that separates the image logo with the background? I am fine with the grey line that separates the menu items. But is there anyway with the logo (box) line?
Kind regards

Thinking about it better, just as an option, knowing how to hide the grey line of the menu would be interesting as well…

Even how to resize the menu area to get it closer to the slider would be great… (If possible)

If you consider I should open a new topic, I will do it.

Kind regards

It worked beautifully.

Glad to hear it – looks good.

To remove the line to the left of the menu and/or to the right of the logo, you would use this CSS:

.main-navigation {
  border-left: none;
}

.site-branding {
  border-right: none;
}

I found the elements to target by looking for the word “border” in the theme’s stylesheet.

If you have any other questions about Pictorico, feel free to start a new thread! I’m marking this one as resolved.

Many thanks, Kathryn, for your help.
I really apreciate it.
best regards
Mariano.

You’re very welcome.