Adding graphics to the website...

[JCBN]

Thanks alot colin, i understand how to do this now. Now its just trying to do it the best way.
For the #header, since i am combining a .jpg and a .png i am kinda forced to make 1 big .png, making the size alot more.

Is it possible to add 2 images to the header, 1 .jpg top and 1 .png below, which has some transparent graphic that .jpg wont handle?

[drake]

- You can use the large .png as header background and the .jpg as header foreground, both of them settled at Skinning -> Header. Also, the png even don't need to be so large because you can choose it's position at the bottom of container, below the jpg.
- Another variant - you can use a thin (with 37px height) png as background for Navigation Bar Below Header (at Skinning -> Navigation Bar.......)
- Finaly you can forget about header settings and use both images in a textwidget placed in Header Widget as simple <img> tags. With CSS you can align images as you wish. (in this last case you will need to hide the blog title and description at Suffusion Option -> Other Graphical Elements -> Header).

Thinking even at combinations between the above variants you have enough posibilities to change the header as you wish...

[JCBN]

Thanks all... slowly making progress.

I decided to make a suffusion-child theme, and edit the style.css that way. I just couldnt/cant get the suffusion options editor to work. Simply trying to make navbar transparent aint working.
But since editing through a child's theme seems to work, that should be an "ok" path to take.

I will still have lots of questions regarding adding graphics, so ill keep using this thread, for now, header seems to work, still a png file tho, so pretty large. But just wanted to see some progress before going to bed..

Looks nice tho!

www.townportal.dk

[Colin]

Start thinking outside the box with your image editing. There are ways with clever use of colours, both in the image and in the page background, that you can create a jpg image that gives you what you want rather than a png.

I think you missed the bit about where to put the custom css and that is in Suffusion Options > Back-End >Custom Includes > Custom styles. There is no need to use the editor to put this in just the back end user interface. IMHO a child them is probably overkill for what you want to do, but if you are comfortable doing it this way then no problem.

AS to the menu transparent backgrounds look at all the options and make sure you understand them. The most important is the first one that is "use custom styles".

[JCBN]

Start thinking outside the box with your image editing. There are ways with clever use of colours, both in the image and in the page background, that you can create a jpg image that gives you what you want rather than a png.

I think you missed the bit about where to put the custom css and that is in Suffusion Options > Back-End >Custom Includes > Custom styles. There is no need to use the editor to put this in just the back end user interface. IMHO a child them is probably overkill for what you want to do, but if you are comfortable doing it this way then no problem.

AS to the menu transparent backgrounds look at all the options and make sure you understand them. The most important is the first one that is "use custom styles".

I did put my css code into Custom Styles, and that worked! But...
...it might be overkill yes, but someone who "helps" me, said i never learn if i do it through an editor, he wanted me to make my own .css file, and well it works out so far!

About the options, i really looked and all, i can read, i did put it to "Use Custom Styles", and when adding background image it showed up in preview, but not on site. Same with navbar options, no matter what i do, nothing changes.
It is ok though, i will change the graphics etc, through the child-theme, i would like some new graphics added as background on those buttons anyways...

Question though:

I am gonna make the container graphics now. I understand that i need to add the repeatable graphic to #container as sayontan said. And i am aware of what i have to do with the #cred element. But... i am unsure as what to do with the top part, which sayontan wanted me to apply to #header-container, should i make a new Div for my needs, looking through firebug its #content i need to look at, but since i have 3 graphics parts i need to add, how do i go about this the best way?

Thanks in advance!

[drake]

Just a paranthesis - Custom Includes -> Custom Styles is not an visual editor, you need to put there exactly the code like in a CSS file maded in notepad or any other text editor... If you learn to add the codes at Custom Styles you already know how to make a .css file. If you copy those codes in a text file and save your file as "mystyle.css" you can tell to your friend that you learn CSS

[JCBN]

Haha, good point.

Maybe ill use it instead then.

As for my container graphics, any idea what to do, i kinda think i need to add another Div for the top part. Or should i just add 2 images to the #content div?

[drake]

I never used or needed another div's for my graphics - those provided by the theme are enough. As I said, for header you can use: foreground, background and how many img tags you need in header widget area... for the rest of site the same, are enough areas for your graphics.

I lie... the only moment when I need another div it was for making the body background automatically resizable for any resolutions - is not your case.

[JCBN]

Even when u need your container to have a top mid and bot graphic? Because i want the middle part to be repeatable?

[drake]

The top part can be combined in header, the bottom part in footer, and repeatabile part can be setlled for wrapper.