Post by zzzzzz2 » Mon May 27, 2019 2:05 am

hi all
Ernie gave me the pointer to my css code controlling the logo in Opencart 2.1 at http://www.themeatshack.shop

currently set to

header div#logo a {
display: block;
width: 238px;
height: 160px;
background-image:url(../image/the-meat-shack.png);
background-size: 238px 160px;
margin:1px 0px 0px 5px;

I have modified the image size and code downwards on two occasions but as you can see from the site the logo stubbornly refuses to get smaller than
about 258px 173px … its really strange...


can anyone explain why the image seems to be scaling back upto a larger size and how to fix

thanks

george

Active Member

Posts

Joined
Sun Aug 06, 2017 5:28 am

Post by IP_CAM » Mon May 27, 2019 3:11 am

You 'placed' the Logo as Background Image, and such cannot be made
responsive ... 8)
Ernie

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by zzzzzz2 » Mon May 27, 2019 4:37 am

Ernie
genius... made me explore background images... and they can be responsive...
header div#logo a {
display: block;
width: 238px;
height: 130px;
background-image:url(../image/the-meat-shack.png);
background-size: contain;
background-repeat: no-repeat;
margin:1px 0px 0px 5px;

so excellent pointers ... thanks my friend....

Active Member

Posts

Joined
Sun Aug 06, 2017 5:28 am

Post by IP_CAM » Mon May 27, 2019 5:40 am

Well, only if one is willing, to settle with that. ::)
Ernie
Imagelink fullsize:
download/file.php?mode=view&id=37100

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by zzzzzz2 » Thu May 30, 2019 3:10 pm

Bum.. Thought I posted this Ernie.. Yes noticed your point checking my solution on mobile.. But try as I may using max size and 100% I cannot improve it.. Any suggestions would be very welcome...

George

Active Member

Posts

Joined
Sun Aug 06, 2017 5:28 am

Post by IP_CAM » Thu May 30, 2019 9:41 pm

1. Your Site is configured to https: // yourshop, but it's relinked internally
to use: https: // www. yourshop
---
2. You have two different linkings to font-awesome:

Code: Select all

 <link href="catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
 <link rel="stylesheet" href="catalog/view/theme/netbiz/stylesheet/font-awesome.min.css" media="screen">
---
3. You have to link/place your Logo in the header.tpl (header.twig) file, not in the stylesheet.css.
---
Ernie

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by zzzzzz2 » Fri May 31, 2019 12:38 am

Sorry Ernie.. Thick me..
I get you telling me where to put the logo... But is the reference to the font relevant to the logo or is it another correction I need to make unrelated to the logo resizing??

Active Member

Posts

Joined
Sun Aug 06, 2017 5:28 am

Post by zzzzzz2 » Fri Jun 07, 2019 4:57 pm

Ernie

can you help me please

if i comment out the css crap for the logo can you suggest the code i need in the attached header.tpl file i use for the current theme

much appreciated my friend

george

Active Member

Posts

Joined
Sun Aug 06, 2017 5:28 am

Post by xxvirusxx » Fri Jun 07, 2019 7:13 pm

Why not use Default theme, then changes colors?

Upgrade Service | OC 2.3.0.2 PHP 8 | My Custom OC 3.0.3.8 | Buy me a beer


User avatar
Expert Member

Posts

Joined
Tue Jul 17, 2012 10:35 pm
Location - România

Post by zzzzzz2 » Fri Jun 07, 2019 9:12 pm

Wish I could.. Prev developer badly hardcoded core and theme so would require a lot of work...

Active Member

Posts

Joined
Sun Aug 06, 2017 5:28 am

Post by xxvirusxx » Fri Jun 07, 2019 9:55 pm

For mobile you can make changes here, you styles.css

Code: Select all

/* SMALL MOBILE TERRITORY */
@media only screen and (max-width: 600px) and (min-width: 0px) {
LE. Why don't use logo from Settings? And you use logo from css...?

Upgrade Service | OC 2.3.0.2 PHP 8 | My Custom OC 3.0.3.8 | Buy me a beer


User avatar
Expert Member

Posts

Joined
Tue Jul 17, 2012 10:35 pm
Location - România

Post by zzzzzz2 » Fri Jun 07, 2019 10:56 pm

Hi
The prev developers badly implemented the site and I have to use their theme which prevents me using normal logo settings and instead uses
Image links within thee css see earlier post in thread....

Active Member

Posts

Joined
Sun Aug 06, 2017 5:28 am
Who is online

Users browsing this forum: No registered users and 64 guests