How to Resize Logo without distortion SMF 2.0.4 Curve theme?
What should I replace in index.template.php?
You cant re-size the default SMF logo without distorting the logo itself. ;)
:)
I meant visual distortion.
Quote from: flash_os on July 21, 2013, 03:01:24 PM
:)
I meant visual distortion.
Apparently I am not understanding you? My comment was specifically aimed at visual distortion.
Quote from: ARG on July 21, 2013, 02:02:59 PM
You cant re-size the default SMF logo without distorting the logo itself. ;)
So why you state this when it's obvious? :(
Are you trying to replace the default logo with your own logo?
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fwww.smokerunner.com%2FThemes%2Fdefault%2Fimages%2Fsmflogo.png&hash=184882a330e318bafa4afe3caa7ea92724ddef5f)
Yes, but bigger. :)
How much bigger?
The SMF logo is 256X34
Here's what you do:
Find SMFLOGO.PNG under Default Images.
Rename it to SMFLOGO1.PNG for example
Then upload your Logo to the Default Image folder where you found the SMF Logo
At that point rename it to SMFLOGO.PNG
That way you don't have to mess with the PHP code.
You might have to refresh your page to get it to show up.
Quote from: flash_os on July 21, 2013, 03:13:01 PM
Quote from: ARG on July 21, 2013, 02:02:59 PM
You cant re-size the default SMF logo without distorting the logo itself. ;)
So why you state this when it's obvious? :(
Duh! Because you asked. Lets just both forget that I tried to help shall we. Have a great day. :o
ARG: Have a great day.
Sorry for misleading you.
Fog:
It's still distort:
I see what you're up against...just simply replacing the SMF logo isn't going to get what you want done.
I have a solution but you'll have to edit your css instead.
Here's a theme that I made that maybe the ticket you're looking for.
http://www.smokerunner.com/index.php?action=forum
It uses a different approach and would probably work better.
http://www.smokerunner.com/index.php?action=forum leads to:
QuoteConnection Problems
Sorry, SMF was unable to connect to the database. This may be caused by the server being busy. Please try again later.
What should I change in css files?
Flash, I haven't forgot about you...
If you're around this weekend give me a shout and I can show you a couple of things.
Take a shout. ;)
You're fast...
Can you find this under your default CSS?
/* the framing graphics */
#header
{
background: #fefefe url('../images/theme/main_block.png') no-repeat 0 -480px;
padding-left: 20px
}
#header div.frame
{
background: url('../images/theme/main_block.png') no-repeat 100% -480px;
display: block;
padding-left:0; padding-right:20px; padding-top:5px; padding-bottom:1em
}
That what I got inside index.css:
/* the framing graphics */
#header
{
background: url(../images/theme/main_block.png) #fefefe no-repeat 0 -480px;
padding-left: 20px;
}
#header div.frame
{
background: url(../images/theme/main_block.png) no-repeat 100% -480px;
display: block;
padding: 5px 20px 1em 0;
}
If you notice the (../images/theme/main_block.png)
the (...) means it coming within your data base,
this part is the folder and sub folders that are used to link the main_block image (images/theme/main_block.png)
One idea I suggest to you so you understand what this does is one simple adjustment.
add (1) right after this part. main_block1.png at this point you should see a difference in your header...
But only do it on the div.frame side
/* the framing graphics */
#header
{
background: url(../images/theme/main_block.png) #fefefe no-repeat 0 -480px;
padding-left: 20px;
}
#header div.frame
{
background: url(../images/theme/main_block1.png) no-repeat 100% -480px;
display: block;
padding: 5px 20px 1em 0;
}[code}
Back frame become wider from the right.
Quote from: flash_os on July 27, 2013, 01:59:33 AM
Back frame become wider from the right.
So you saw a difference is the main thing...
Now upload your banner to the .../images/theme folder
Then change the CSS to reflect the name of the image.
Also you have to change up the -480px to 0px.
/* the framing graphics */
#header
{
background: url(../images/theme/main_block.png) #fefefe no-repeat 0 -480px;
padding-left: 20px;
}
#header div.frame
{
background: url(../images/theme/name_of_image.xxx) no-repeat 100% 0px;
display: block;
padding: 5px 20px 1em 0;
}