Site Tour

DEMO: http://www.webwurkz.net/v2demo-flava/index.php?do=...

1. Extract the package
2. Upload the all contents of the "upload" folder into your phpfox directory.
3. Insert code to your "theme/frontend/themename/style/default/css/layout.css" 

#ssmain { width:910px; }
		#sspanel { float:left;width:650px;height:400px;overflow:hidden; }
		#sscontainer { width:2600px; }
		.sstabs { background:#f9f9f9;width:640px;height:390px;float:left;font-size:9pt;padding:5px;}
		.sstabtitle { font-size:14pt; }
		.ssmenu { width:250px;float:right; }
		.ssmenu1 { background:#f9f9f9;font-size:9pt;line-height:30px;cursor:pointer;padding:3px;border-top:1px solid #f9f9f9;border-bottom:1px solid #f9f9f9;margin-bottom:2px; }
		.ssmenu2 { background:#E7F6FF;font-size:9pt;line-height:30px;cursor:pointer;padding:3px;border-bottom:1px dashed #28AEFC;border-top:1px dashed #28AEFC;margin-bottom:2px; }
		.ssmenu1 .ssmenuidx { font-size:9pt;font-weight:bold;color:#000;margin-right:10px; }
		.ssmenu2 .ssmenuidx { font-size:9pt;font-weight:bold;color:#28AEFC;margin-right:10px; }


4. Create a new page name it to whatever you want.
- Uncheck these options (BBcode, Emoticons, Add Smart Breaks)
- insert this code 

{literal}
<script type="text/javascript" src="static/jscript/jquery/ui/effects.core.js"></script>
<script type="text/javascript" src="static/jscript/teamwurkz/sssitetour.js"></script>

{/literal}

<div id="ssmain">

<div class="ssmenu">
<div id="slide0" onclick="tabslide(0);" class="ssmenu2" ><span class="ssmenuidx">1</span> What is mycommunity</div>
<div id="slide1" onclick="tabslide(1);" class="ssmenu1" ><span class="ssmenuidx">2</span> Upload and Share</div>
<div id="slide2" onclick="tabslide(2);" class="ssmenu1" ><span class="ssmenuidx">3</span> Meet new friends</div>
<div id="slide3" onclick="tabslide(3);" class="ssmenu1" ><span class="ssmenuidx">4</span> Keep in touch</div>
</div>

<div id="sspanel">
<div id="sscontainer">
	<div class="sstabs" >
	<div class="sstabtitle">What is Mycommunity</div><br/><br/>
	
	With phpFox2 you can start tomorrow's next big thing today by creating social networking sites just like Facebook or MySpace!
	
	
		
	</div>
	
	<div class="sstabs" >
	<div class="sstabtitle">Upload and Share</div><br/><br/>
	There are many things you can upload and share with our community.
	<br/><br/>
		<div style="margin-left:50px;">
		• blogs<br/>
		• photos<br/>
		• music<br/>
		• videos		
		</div>
	</div>
	
	<div class="sstabs">
	<div class="sstabtitle">Meet new friends</div><br/><br/>
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sodales consectetur eros, sed blandit urna venenatis vitae. 
	Pellentesque hendrerit odio non sapien varius viverra. Maecenas eget eros nibh, non vestibulum lacus. Duis in tortor nec purus mattis sagittis. 
	Sed scelerisque lorem eget lorem viverra elementum.
	</div>
	
	<div class="sstabs">
	<div class="sstabtitle">Keep in touch</div><br/><br/>
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sodales consectetur eros, sed blandit urna venenatis vitae. 
	Pellentesque hendrerit odio non sapien varius viverra. Maecenas eget eros nibh, non vestibulum lacus. Duis in tortor nec purus mattis sagittis. 
	Sed scelerisque lorem eget lorem viverra elementum.
	</div>

</div>	
</div>

</div>



That's it! You can now edit the content.

NOTE: When updating the codes always uncheck these options (BBcode, Emoticons, Add Smart Breaks).

Have a nice 2010!


Attached Files

Reviews
WebDude wrote at June 21, 2012, 5:15 pm

excellent free mod Ive reworked it so the menu is under the slides and is horizontal instead of vertical tried using backgrond images on the slides them selves but got terrible flicker on most monitors only thing I dont like is when it reaches the last slide it "jump slides" to slide one instead of reversing the order at the same speed it did forward in any even thanks and KUDOs toCool Wurks for this free mod

WebDude
yrmc wrote at April 9, 2011, 4:35 am

I don't understand very well that does this?

I press Step 2 and nothing happens...

yrmc