oneposhshop:
First of all I want this background to show up on the page that is viewed when you click on this link http://oneposhshop.com/Shop and judging from the page source and the changes that I made to the "tpl_main_page.php" file that isn't the tpl_main_page.
The other thing I'm not clear on is, how do you, "create containers" in the tpl_main_page.php?
Here is what I did in the tpl_main_page.php,```
<div id="mainWrapper">
<?php
/**
* prepares and displays header output
*
*/
require($template->get_template_dir('tpl_header.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_header.php');?>
<div class="roundcont">
<div class="roundtop">
<img src="http://oneposhshop.com/Shop/includes/templates/Posh_by_Trois_Soeurs/Images/left_corner_bg.jpg" alt=""
width="15" height="15" class="corner"
style="display: none" />
</div>
<p><img src="http:/oneposhshop.com/Shop/includes/templates/Posh_by_Trois_Soeurs/Images/Trois Soeurs.gif"></p>
<div class="roundbottom">
<img src="http://oneposhshop.com/Shop/includes/templates/Posh_by_Trois_Soeurs/Images/bot_left_corner_bg.jpg" alt=""
width="15" height="15" class="corner"
style="display: none" />
</div>
</div></div>
<!-- bof breadcrumb -->
Well, not quite. You'd need to put the opening one before <div id="mainWrapper"> and the ending ones before the closing </body> You'll have to play around with the placement and css quite a bit.
I looked at your image:
<http://oneposhshop.com/Shop/includes/templates/Posh_by_Trois_Soeurs/Images/bot_left_corner_bg.jpg>
And that's an awfully large corner. Do you want it that big? Remember that now you'll have a chunk that tall and wide where no text can be.
I like the route you're going, I think its very unique, but I think I'd simplify it by removing the outer shadows, make the corners arcs much smaller, and it would save you some grief. You also need to save it as a gif with a transparent background if you want the background to show through.
Here, I made a corner that I think would work better for you, and have attached it to this message. It's 29px tall by 29px wide, so you'd need to adjust that in the code. Just rotate it and resave it for each corner.
After creating the containers, you'll have a good bit of work in the css to make this the correct widths and such. Its not a simple procedure, sorry!