Seller Help Store Setup Templates Enhancements Website Integration Brand Tags (Reseller) Base Prices Setting up a Store These instructions are applicable for setting up all types of stores. Premium and VIP Stores are essentially upgraded Free Stores, so lets first open up a Free Store. Step 1. Open a free store Click here. You will be prompted to create an account if you haven't done so already. Enter your PayPal email address to get paid In order to be paid your earned commissions, you'll need to enter your PayPal email address. When logged in, go to Payee Information on the left menu, or click this link to enter it now: http://www.pictureyourlife.com.au/Stores/Payee.aspx Step 2. Upgrade the free store You can open an unlimited number of stores and upgrade any you choose. To view and manage all your stores click here or click on the top left menu and select Members Area > My Stores > Manage Stores. On the right side are store upgrade options. Click on the type of upgrade you are choosing and follow the instructions. Step 3. (VIP) This step is completed outside of our website. Buy a domain name We recommend GoDaddy, NameCheap or OnlyDomains. Search for the domain that you want on their sites and complete the registration there. Edit the nameservers The nameservers will need to be changed to: ns1.vip-stores.com ns2.vip-stores.com Instructions to change the nameservers for Only Domains | NameCheap | GoDaddy Step 4. (VIP) This step is completed in Store Profile on our website Enter your domain name on your VIP store profile Click here (or click on the top left menu on any page and select Members Area > My Stores > Manage Stores) and click on Store Profile on the upgraded VIP Store . Scroll down to where it says Domain Name (VIP Store only) and enter the domain name you bought there. When this step is completed, all VIP features will automatically activate. Seller Tutorial Videos Note, the following videos do not have any audio, they simply show the steps taken. How to add or change the templates How to Replace Template Header with Own Logo How to Add Social Buttons How to Add Secure Payment Icons How to Change the Font How to add different sections and sub-sections How to hide and show the sections on main page and sub-category How to add some certain products into certain sections How to move products from one section to another section How to Bulk Add products to your store How to add featured products in main pages or category How to add RockYou.com Flash Glitter Fonts How to add Google Adsense code How to get a support@yourdomain.com email address via Google How to make transparent images for dark shirts use (by GIMP Software) How to markup the product prices VIP Only - How to markup the Shipping Prices VIP Only - How to customise the invoice header and footer VIP Only - How to add coupon code, like "$8 off $20 Purchase" or "Free Shipping" VIP Only - How to remove the footer of "Powered by Picture Your Life" VIP Only - How to add a custom page VIP Only - How to choose which page to be the home page Customising the Templates Our Free, Premium, and VIP store templates are all completely customisable. We have provided complete instructions below on how to completely modify exisiting templates to suit your own brand and design. This assumes some basic knowledge of web design. If the below instructions seem too foreign to you and to save the spiraling costs of hiring a web developer, we can do the work for you for AU$200. If you haven't already done so, create a new store, it can be used as a Free store or can be upgraded to a Premium or VIP Domain store. Add Template Log in if necessary Step 1: Go to Account from the top menu, then click Manage Stores (or use and bookmark this link: http ://www.pictureyour.life/Stores/AllStores.aspx) Step 2. Click Add Template from the store you are customising Step 3: Choose your template based on the general colour or feel you are after. 21a-Super and 24a-Super are the most customisable. Click "Add to My Template" to select. . Modifying the Template Repeat step 1 above if necessary Step 4: Now click My Template from the store you are customising Step 5: Click Customise from the active template (the one that has a tick in the Active column) Change the template sections You will then get a screen that displays the following sections. Click on any section on the left to perform the instructions explained here. Scroll down further if you wish to see more detailed instructions. StoreControl The main options for how the products are displayed StoreBaseControl Show or hide the store name on the page MostTopHtmlBlock Insert your custom HTML/Java/CSS at the very top of the page TemplateHeaderHtmlBlock Choose "Hidden for all pages" to replace with HTML above StoreInfoSupportPhone If not hidden, can put a number or HTML/Java/CSS code StoreInfoTitle If not hidden, the text entered as the title of the store shown here. TemplateFuncHtmlBlock The left menu. Can hide for all pages or set which pages to be visible on, such as member areas TopLeftHtmlBlock Can add your own HTML/Java/CSS code to the menu at the top CategoryGroupControl The "hot products" cloud. Choose whether to customise or hide. MenuControl Store Menu Ignore StoreSearchControl Store search bar, can edit or hide. ProductListControl Pre-created products list. Can customise or hide. SectionControl Edit the look of how pre-designed products are displayed StoreNewsLetter Select Hidden for All Pages (not currently functional) BottomLeftHtmlBlock Can add your own HTML/Java to the menu at the bottom TopBarControl Top Bar The top menu, can be customised how you wish SuperTopBarControl Super Top Bar Not used for this level of store TopHtmlBlock Insert your HTML/Java at the top just before the main content StoreNavigator A "cookie trail" showing customers which area they are on StoreHelpPanel Can be customised, or select Hidden from all Pages to remove MostBottomHtmlBlock Add your own HTML/Java to the footer of the page Hiding sections To hide a section such as the template header graphic choose "Hide for all pages" from the "1.Visible" dropdown menu and click "Save." If you only want to show a section on specific pages, such as the left menu on member area pages, choose "Visable for specific pages" then click the box of each page you want it to show on. Entering your own code Now we can create the template to your liking with HTML and CSS etc. The place to enter the code is in the following sections: MostTopHtmlBlock - as implied, the top most part of the template TopHtmlBlock - the top of the content after the store title etc TopLeftHtmlBlock and BottomLeftHtmlBlock (if you are not hiding the side menu/panel) TemplateFooterHtmlBlock - the bottom of the main content MostBottomHtmlBlock - as implied, the most bottom part of the template And also: Store Profile - Useful for features not dependant on templates, such as Google Analytics, web fonts, etc. Custom Pages - You can use html, css, java scripts to create your own stylish or feature-rich pages Server Controls You can disable sections as explained above and display them elsewhere in your template. Copy and paste the below server controls where you would like them to appear (Custom Pages or template sections that are named MostTopHtmlBlock, TopHtmlBlock, TopLeftHtmlBlock,BottomLeftHtmlBlock, TemplateFooterHtmlBlock, or MostBottomHtmlBlock.) Server controls (copy/paste) Description (#Content#) Content of your store, Must include in your store template (#WebFile Url="t1.gif"#) Image Url, you must have t1.gif in your file manager. (#StoreHtml ID=XXXXHtmlBlock#) Custom html block (#StoreInfo StoreField="StoreTitle"#) Store Title (#StoreSearchControl#) Store search control (#ProductListcontrol#) Product list control (#SectionControl#) Store category tree control (#StoreNewsletter#) Store news letter control (#CustomPageTreeControl#) Store custom page tree control (#StoreNavigator ID=StoreNavigator#) Store navigator control (#StoreHelpPanel#) Store help panel (#TopBarControl#) Top Bar of VIP Store (#CartCountControl#) Show the item count in the cart, if cart is empty , show nothing. Enhancements Please read the "Templates" section first to know how to make the following enhancements. It requires copy/pasting the provided code below into the relevant sections previously explained. Change the font You can use the example code below to change the font to Raleway. Copy/paste it into any MostTopHtmlBlock, TopHtmlBlock, TopLeftHtmlBlock, BottomLeftHtmlBlock, TemplateFooterHtmlBlock, or MostBottomHtmlBlock. <link href="https://fonts.googleapis.com/css?family=Raleway" type="text/css" rel="stylesheet" /> <style type="text/css"> table,tr,td,p,.p,br,body,div,li,span,big,blockquote,label,name, h1, h2, h3, h4, h5, h6, .zi06 { font-family: 'Raleway', arial, sans-serif; font-weight:lighter; } </style> You can get free fonts for your website and the same above instructions to use them at www.google.com/fonts To use your own specific font, you will need to convert to css (google the free sites that do this) and link it with this code: <link href="http://www.somewhere.com/fontname.css" type="text/css" rel="stylesheet" /> Then, use the name of the font in the font-family part <style type="text/css"> table,tr,td,p,.p,br,body,div,li,span,big,blockquote,label,name, h1, h2, h3, h4, h5, h6, .zi06 { font-family: 'fontname', arial, sans-serif; } </style> Replace text In the same way you inserted the above code in the the HTMLBlock sections of the template, you can also do the same with Javascript. This script will replace standard text on your store that you normally can't change. Use it to make changes in spelling between USA and UK etc, or rephrase sentences. Don't use it make false claims or be misleading however or you could find yourself in a lawsuit. Copy/paste the code below into MostBottomHTMLBlock, but you can change the text shown as underlined to what you would like to change. <script type='text/javascript'> /* * jQuery replaceText - v1.1 - 11/21/2009 * http://benalman.com/projects/jquery-replacetext-plugin/ * * Copyright (c) 2009 "Cowboy" Ben Alman * Dual licensed under the MIT and GPL licenses. * http://benalman.com/about/license/ */ (function($){$.fn.replaceText=function(b,a,c){return this.each(function(){var f=this.firstChild,g,e,d=[];if(f){do{if(f.nodeType===3) {g=f.nodeValue;e=g.replace(b,a);if(e!==g){if(! c&&/</.test(e)){$(f).before(e);d.push(f)}else {f.nodeValue=e}}}}while(f=f.nextSibling)}d.length&& $(d).remove()})}})(jQuery); $("body *").replaceText( /original/gi, "changed" ); $("body *").replaceText( /original sentence/gi, "changed sentence" ); </script> Replace Images You can use this javascript code in the same way as the other examples above to replace the quality and dimensions/size of the standard images. The below example loads higher resolution images from our server and also increases their dimensions/sizes from 240px to 320px for example. It is applied when the page loads so all product images are replaced by the script. <script type=text/javascript> var images = document.getElementsByTagName('img'); for (var i=0; i<images.length; i++) { var img = images[i]; img.src = img.src.replace(/0-1-1$/, '0-3-1'); if (img.width == '240' && img.height == '240') { img.width = '320'; img.height = '320'; } if (img.width == '120' && img.height == '120') { img.width = '130'; img.height = '130'; } img.src = img.src.replace(/0-2-1$/, '0-1-0'); } </script> Another way is with the use of a link for the visitor to click. The advantage of this method is saving bandwidth and page load time for the visitor, and also gives better control if certain images on certain pages shouldn't be resized. Paste this code where you want the link to be, for example in TopHTMLBlock (above the main content of the store) <a style="text- decoration:none;" href="#" onClick="HDimages()" title="View larger product images"> <big>#128269</big> <sup><sup><sup><b><b style="color:#575b5f;"> +</b></b></sup></sup></sup> <small style="color:#575b5f;"> HD</small> </a> <BR><BR> <script language = JavaScript"> function HDimages () { var image = document.getElementsByTagName('img'); for (var i=0; i<image.length; i++) { var img = image[i]; if (img.width == '120' && img.height == '120') { img.width = '210'; img.height = '210'; } img.src = img.src.replace(/0-2-1$/, '0-0-0'); } } </script> Product Slideshow (VIP only) Add a nice product slider to your store. Copy/paste this code to any custom page or these template sections: MostTopHtmlBlock, TopHtmlBlock, TemplateFooterHtmlBlock, or MostBottomHtmlBlock. <!-- START SLIDER --> <link href="http://cjsmedia.atwebpages.com/java/jsImgSlider/themes/1/pyl-slider2generic.css" rel="stylesheet" type="text/css"> <script src="http://cjsmedia.atwebpages.com/java/jsImgSlider/themes/1/js-image-slider.js" type="text/javascript"></script> <div id="sliderFrame"> <a href="/create/default.aspx"> <div id="overlay" title="Click here or click the images to view the products"></div> </a> <div id="slider"> <a href="/diy/all-over-print-apparel"><img src="http://c3.vip-stores.com/img/16-118075970-0-0-1" alt="Full cover printed clothing & accessories"></a> <a href="/diy/bag"><img src="http://c3.vip-stores.com/img/16-118075979-0-0-1" alt="Personalised Hangbags, Schoolbags, Tote Bags, and more"></a> <a href="/diy/phone"><img src="http://c3.vip-stores.com/img/16-118075984-0-0-1" alt="Custom Smartphone Cases"></a> <a href="/diy/book"><img src="http://c3.vip-stores.com/img/16-118075986-0-0-1" alt="Create your own photo books or story books"></a> <a href="/diy/cat0504"><img src="http://c3.vip-stores.com/img/16-118075993-0-0-1" alt="Custom Cards & Stationery" title="Cards & Stationery"></a> <a href="/diy/cat0512"><img src="http://c3.vip-stores.com/img/16-118075996-0-0-1" alt="Home Decor - Designed by you!" ></a> <a href="/diy/acrylic-jigsaw"><img src="http://c3.vip-stores.com/img/16-118076001-0-0-1" alt="Make your own Jigsaw Puzzles"></a> <a href="/diy/dog"><img src="http://c3.vip-stores.com/img/16-118076002-0-0-1" alt="Puppy stuff!"></a> <a href="/diy/cat0505"><img src="http://c3.vip-stores.com/img/16-118076005-0-0-1" alt="Custom Clothing & Accessories"></a> <a href="/diy/flip-flops"><img src="http://c3.vip-stores.com/img/16-118076007-0-0-1" alt="Personalised Thongs/ Flip Flops" ></a> <a href="/diy/electronics"><img src="http://c3.vip-stores.com/img/16-118076015-0-0-1" alt="Customised Electronics"></a> <a href="/diy/speaker"><img src="http://c3.vip-stores.com/img/16-118076018-0-0-1" alt="Personalised Portable Speakers"></a> <a href="/diy/watch"><img src="http://c3.vip-stores.com/img/16-118076021-0-0-1" alt="Photo Watches"></a> <a href="/diy/wall-clock"><img src="http://c3.vip-stores.com/img/16-118076024-0-0-1" alt="DIY Wall Clocks" ></a> <a href="/diy/252,253,254"><img src="http://c3.vip-stores.com/img/16-118076026-0-0-1" alt="Cute Personalised Clocks"></a> <a href="/diy/keychain"><img src="http://c3.vip-stores.com/img/16-118076029-0-0-1" alt="Key Chains"></a> <a href="/diy/tablet"><img src="http://c3.vip-stores.com/img/16-118076033-0-0-1" alt="Popular Tablet Accessories"></a> <a href="/diy/umbrella"><img src="http://c3.vip-stores.com/img/16-118076039-0-0-1" alt="Design your own Umbrellas"></a> <a href="/diy/block"><img src="http://c3.vip-stores.com/img/16-118076041-0-0-1" alt="Acrylic Photo Blocks"></a></div> </div> <!-- END SLIDER --> Social Icons Add social sharing buttons to your store. The following code is best placed at the beginning of TopHTMLBlock <!-- AddToAny Social Icons BEGIN --> <div class="a2a_kit a2a_kit_size_32 a2a_default_style" style="float:right; margin-bottom: 15px; margin-top:-15px"> <a class="a2a_dd" href="https://www.addtoany.com/share"></a> <a class="a2a_button_facebook"></a> <a class="a2a_button_twitter"></a> <a class="a2a_button_google_plus"></a> </div> <script async src="https://static.addtoany.com/menu/page.js"></script> <!-- AddToAny Social Icon END --> Payment Icons Increase trust with payment and security buttons. The following code is best placed at the end of MostBottomHtmlBlock. <div id="icons" style="text-align:center";><br> <img src="http://www.ferricfusion.co.uk/wp-content/uploads/2015/01/paypal-transparent-logo.png" alt="PayPal" title="PayPal is the secure way to pay without sharing your financial information"> <img src="http://www.securesitehost.com/wp-content/uploads/2015/01/ssl.png" alt="SSL Encryption" title="SSL encrypts your information so it can't be stolen during checkout" height=51 style="margin-bottom:7px;"> <br></div> Website Integration Now that you have learned how to hide sections and use server controls, you can display your store inside another website. Please note that this may not be practical or fully functional, so please consider whether this is the best option for you. The simplest way to integrate your finished store is with iframe tags. </iframe src="(link to your store)"></iframe> To make this look as seemless as possible you should have the same branding design elements in your store template as your website that you want to integrate with, including the same css styles for headings and backgrounds etc. The width and height of the iframe can also be set as best suited to your website. Sometimes it is best to have a fixed width and height, others it is best to resize according to the content. You will need to either experiment with this or hire a web developer. We can also do this for you for AU$50 if you have already finalised the template. Here is an example of using Javascript for automatically sizing iframes according to their content. Add this the <head> section of your website: <script language="javascript" type="text/javascript"> function resizeIframe(obj) { obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px'; } </script> And this section to where you want the store to display: <iframe src="url to your store" frameborder="0" scrolling="no" onload="resizeIframe(this)" /> Custom Brand Tags (reseller accounts only) 1. All brand tags must be center folded, saved as an .ai file (Adobe Illustrator). When you design the brand tags, please add two sew-in borders of 10mm. 2. Brand tag fees: 5000 for $500, for 2 colours. If it is white background, you can have 3 colours (including white). For extra colours, it costs extra US$200 per colour. 3. The brand tag fees US$500 is for one design only, if you need to change tag designs, you need to start again. 4. For US$500, we will keep 5,000pcs brand tags for you in stock, which includes XS(300pcs), S(1,000pcs), M(1,000pcs), L(1,000pcs), XL(1,000pcs), 2XL(400pcs), 3XL(300pcs), we will inform you to deposit another US$500 fees when one of them is going to be out of stock. You can also design the quantity of each size. 5. All allover print apparels will include material tags. For the brand tags you have designed, please don't include the material inside. See sample here. 6. If you get any questions, please contact our customer services for more details. Base Prices The prices below are available only for our subscribers. They are the prices we offer you on which you can set your own markup. VIP/Premium Stores Reseller US$ Price List (not updated instantly)