PDA

View Full Version : New Wordpress Design Shop

Bluesplayer
05-02-09, 16:33
Ouch!

Made a right balls up the other night. Was working on a new part of my site - redesigning it as usual - and managed to upload the new wordpress design into the wrong directory and wiped out my shopwindow in the process! This was because my shopwindow was using the files from my wordpress installation. I nearly always make backups but in this case I hadn't! Had to rapidly find a new design and redo the whole shopping side of the site. First of all I used this design:

Architectural Digest (http://topwpthemes.com/architectural-digest/)

A beautiful design but doesn't lend itself well to the shopwindow as the shop really needs a white background in certain parts. I did use this design though for a while. If you are looking for FREE and incredibly nice wordpress designs then the site above is one to visit. I eventually settled for this one:

Shopaholic (http://topwpthemes.com/shopaholic/)

Again it is another design off the same website. I quickly installed it on my wordpress uk shop listing and then converted my shopwindow to use the same files. Lastly I made my smf forum use part of the design - header part - so that the 3 sections are all integrated. I am pretty happy with the result. Still some tweaking to do but overall I think the design looks much better than it did previously :) . I might well convert some wordpress themes and make them available for use here...

End Results - Shopwindow (http://ukshopping-4u.com/shopwindow) - Shop Listing (http://ukshopping-4u.com) - Smf Shopping Forum (http://bluesplayer.co.uk/shoppingforum)

Regards
Bluesplayer
kododesign
07-02-09, 00:44
Well done, that's a nice site :)

Do you have any pointers for people looking to do the same thing, i.e. integrate Shopwindow with Wordpress? Like, where to start? :confused:

Cheers,
Nikki.
Bluesplayer
07-02-09, 02:10
Well done, that's a nice site :)

Do you have any pointers for people looking to do the same thing, i.e. integrate Shopwindow with Wordpress? Like, where to start? :confused:

Cheers,
Nikki.

Hi

Thanks for the complement.

I wrote extensively on integrating the Shopwindow to a Wordpress template but I don't think anyone managed to follow my instructions. It is quite easy really. In fact you can easily use any website template. To summarize as short an explanation as possible to integrate to a Wordpress template you do this:

1. Run Wordpress with the design you want to use.
2. Right click the page and copy the code.
3. Remove all the non design characters (leave the design divs etc)
4. Add the Wordpress template css file to the shopwindow page_header.tpl (same path found in the right click page code copy).
5. Add the top section of the Wordpress template to the page_header.tpl.

My own header

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head profile="http://gmpg.org/xfn/11"><title>UKshopping-4u.com </title><meta http-equiv="content-Type" content="text/html; charset=UTF-8" />

<link href="/wp-content/themes/Shopaholic/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="{$templatePath}css/styles.css" type="text/css">

</head>

<body>
<div id="rap">
<div id="header">
<div class="header-title"><a href="/shopwindow">UKshopping-4u.com</a></div>
<div class="header-description">UK Shopping with the best uk sites...</div>
</div>

<!-- begin sidebar -->
<div id='menu-left'>

6. Add the footer code to the page_footer.tpl

My own page_footer.tpl

<div id="footer"><br/><p>

Site is powered by <a href='http://wordpress.org'>Wordpress</a>.
<a href='http://topwpthemes.com'>Wordpress theme</a> designed by <a href='http://designed.nu'>Design Blog</a>.</p>
</div>

<?php include_once( $_SERVER["DOCUMENT_ROOT"]."/slimstat/inc.stats.php" ); ?>

</body>
</html>


7. Place the shopwindow code from index.tpl in the correct places in the new design. My own index.tpl code looks like this:

{include file="elements`$DIRECTORY_SEPARATOR`page_header.tpl"}

{include file="elements`$DIRECTORY_SEPARATOR`query_list.tpl"}

<h2>Product Search</h2>

{include file="elements`$DIRECTORY_SEPARATOR`search_box.tpl"}

<h2>Advertisements</h2>

<!-- Main Ad Body Starts -->


<div id="adcontainer">


<div id="adboxes">
<ul>
<li><a href="http://www.awin1.com/cread.php?s=114996&v=2173&q=78285&r=38953" target="_blank" ><img src="http://www.affiliatewindow.com/linkimages/2173/125x125_white_ring.jpg" width="125"

height="125" border="0" alt="Visit Sponsor" /></a></li>

<li><a href="http://www.awin1.com/cread.php?s=39896&v=1021&q=22746&r=38953" target="_blank" ><img src="http://www.affiliatewindow.com/linkimages/1021/banner_still_25x25.gif" width="125"

height="125" border="0" alt="Advertise Here" /></a></li>

<li><a href="http://www.awin1.com/cread.php?s=133618&v=2209&q=84338&r=38953" target="_blank" ><img src="http://www.affiliatewindow.com/linkimages/2209/small_button_delivery.jpg" width="125"

height="125" border="0" alt="Advertise Here" /></a></li>

<li><a href="http://www.awin1.com/cread.php?s=77119&v=1270&q=63687&r=38953" target="_blank" ><img src="http://www.affiliatewindow.com/linkimages/1270/bru_generic_125x125_3.gif" width="125"

height="125" border="0" alt="Advertise Here" /></a></li>

</ul>
</div>
<div class="clear"></div>

</div>

<!--Main Ad Body End-->

<ul>
{include file="elements`$DIRECTORY_SEPARATOR`category_tree.tpl"}
</ul>

</div>

<div id="content">


<div style="position: absolute; margin-top: -86px; padding: 5px; font-size: 12px;">
<a href="/shopwindow">Home</a> | <a href="/?page_id=121">About us</a> | <a href="/?page_id=150">Contact us</a> | <a href="http://bluesplayer.co.uk/shoppingforum">Offer Forum</a> | <a href="/?page_id=2457">Offsite Links</a> | <a href="/">View UK Shops</a></div>


<div class="post">

{include file="elements`$DIRECTORY_SEPARATOR`hot_picks.tpl"}
</div>

<!-- begin footer -->
</div>
<div id="credit">
</div>

</div>

{include file="elements`$DIRECTORY_SEPARATOR`page_footer.tpl"}

8. Copy your created new index.tpl and use the design for the rest of the files - category.tpl, product.tpl etc. Use the code found in the default files and place them where you want the contents to show - category_tree.tpl in the side panel and so on.
9. Remove various bits of design styling from the shopwindow style.css or from the wordpress style.css (make a new one and then alter that - alter the name in the shopwindow page_header.tpl). You want the overall design to be controlled by wordpress - so you can remove body design css - links styling etc from the shopwindow css.

Really the above is it. You will still need to tweak various bits and pieces of code such as I had to so that I could place the search in the right side bar.

I suppose if you haven't done this before it is an absolute nightmare and possibly too hard to do but I have done this umpteen times and I can now get it working in just a few hours. Just set up a practise Wordpress site and Shopwindow and keep messing about with them until you get it working.

Best of luck

Regards
Bluesplayer
kododesign
07-02-09, 20:40
Wow, thats really helpful! Thanks very much :D
rapid
09-02-09, 00:39
Hi Guys,

I'm totally new to AW/SW & Affiliate marketing / Web design in general.. been playing getting a basic shopwindow up and running which I have, but customising it is a different matter :)

I'm really keen on using a wordpress template and integrating the SW in to it..

Would using wordpress mean I could allow people to review products / merchants? or would this be far too difficult due to the number of products and how the pages are being made on the fly?

I will give your above instructions a go, It would be good if there was a dummies guide in more detail.. but i will see how i get on,

Thanks for the info,
R
Bluesplayer
09-02-09, 00:53
Hi

The above is just to use the Wordpress template design. You can list merchants with Wordpress and review them - which is exactly as I am doing on my site, but you can't review products. There was a module with Drupal at one time but that isn't being developed now - at least I don't think it is. Here is the page for it:

http://drupal.org/search/node/shopwindow

Doesn't look like it will work with the latest version of Drupal.

You could perhaps pick on certain products and post them inside Wordpress. That way products could be reviewed and rated but as products change or sell out etc this could be problematical.

Regards
Bluesplayer
ushop-online
11-03-09, 13:32
I'm really impressed with what you have done with integration with wordpress.

I have recently moved away from writing my own websites to using wordpress as a site engine -- I think I will look into using it for my shop as well.

It is very helpful that you share how you did it -- Thanks!