Please can someone hep me with my website?

  • 2
  • Question
  • Updated 9 years ago
  • Answered
Hey I need someone to complete or to help me please i need to make the first page as the same content as the ebay homepage - In other words I want some of my products to be shown on the hompaeg and how do I add a search box?

Thanks alot
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
  • Confused and Fustrated

Posted 9 years ago

  • 2
Photo of UK Duke

UK Duke, Champion

  • 3321 Posts
  • 213 Reply Likes
To get your home page looking like ebay your going to need a team of the best web designers in the world :)

You could just use images of your products and link to the item.

See this tutorial - http://www.yola.com/tutorials/creatin...

As for the search box, i use this service on my site http://www.picosearch.com/

I like it because you can get them to re crawl your content any time you like.

Lee - http://www.hexham.info
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Hello BloodMoney,

Lee has given you some great suggestions. Please check out the tutorial for creating an online store; hopefully this will help you do what you would like with your store products. Although I am not familiar with picosearch, if Lee says it is good, than it must be, he's a pro :)

Emmy
Photo of Connor McCarra

Connor McCarra, Champion

  • 944 Posts
  • 47 Reply Likes
Hi BloodMoney,

Check out this widgetbox widget, could be what your looking for: I am-Selling.

To add a widget from widgetbox you have to:

1. Drag and drop a html widget to your page.

2. Tweak your settings on the widgetbox page (the link I provided) and click on 'get widget'.

3. Copy the embed code in the modal box that pops up.

4. Then paste it into the html widget.

5. Save and preview your page to view the widget.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Hey to all !
Thanks for the tips everyone - Im working on it now and if I need more help - Then ill post it here.

Thanks
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Hey again

Is there any way of making your own template?
Photo of Marije

Marije, Official Rep

  • 4636 Posts
  • 237 Reply Likes
Hi BloodMoney - there isn't a way to make or add your own template on Yola.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Oh ok Thanks - Is there anyway to start your template from scratch - meaning on a blank canvas ? And Change the colour of the template? And Can you possibly give me some ideas for a site name?

My site is a auction site - Abit like Ebay - And im struglling to find a name - because all the onez Iv thought of have already been used.

Please help

Thanks
Photo of Connor McCarra

Connor McCarra, Champion

  • 944 Posts
  • 47 Reply Likes
Hey BM,

what are you selling?
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Well eerything really - Im just going to add modules - And people can add there product in the catergory the item falls in - So the questions answers is everything really.
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Hi BloodMondy,
Here is an answer that one of our Yola Champs gave on the topic of using or creating your own template; we couldn't have said it better! If you would like to see the original thread, please click here: Use own template.

Emmy
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
More questions ( Sorry )

1. How can I make a drop down bar on my new page . E.g I made a new page named ''Catergories'', and I want a drop down bar so all the catergories show, and how do I make the content show? E.g when someone clicks the drop down bar the content will show , but say if one of my catergories are games, how do I make that clickable? Do I need to make a new page ? I dont want to do that. please help.

Thanks
Photo of Connor McCarra

Connor McCarra, Champion

  • 944 Posts
  • 47 Reply Likes
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Hey Connor McCarra

Thanks for the links, But I dont know much about codeing, Where do I put them codes you supplied within the links?
Photo of Connor McCarra

Connor McCarra, Champion

  • 944 Posts
  • 47 Reply Likes
Can you give me the link to the one you want to use, Thanks.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
http://www.dynamicdrive.com/dynamicin...

Thats the one im planning to use. Thanks
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Connor McCarra - Sorry but hows the drop down bar thing going - I posted the link to the one I wish to use - sorry - But I want to finish my website quickly.

Thanks
Photo of Connor McCarra

Connor McCarra, Champion

  • 944 Posts
  • 47 Reply Likes
Sorry BM, I have been away all day this past few days, and finding it hard to get time to reply. I''l take a look now.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
When you want to create a link - Do we need to make a new page?
Photo of Connor McCarra

Connor McCarra, Champion

  • 944 Posts
  • 47 Reply Likes
Hello BM,

Ok, here it is:

First add a 'html widget' too the top of your page, then add this code:

(Remember to leave out the <!-- and --> !)

<!--

<style type="text/css" />

/* ######### CSS for Shade Tabs. Remove if not using ######### */

.shadetabs{
padding: 3px 0;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 12px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.shadetabs li{
display: inline;
margin: 0;
}

.shadetabs li a{
text-decoration: none;
position: relative;
z-index: 1;
padding: 3px 7px;
margin-right: 3px;
border: 1px solid #778;
color: #2d2b2b;
background: white url(shade.gif) top left repeat-x;
}

.shadetabs li a:visited{
color: #2d2b2b;
}

.shadetabs li a:hover{
text-decoration: underline;
color: #2d2b2b;
}

.shadetabs li a.selected{ /*selected main tab style */
position: relative;
top: 1px;
}

.shadetabs li a.selected{ /*selected main tab style */
background-image: url(shadeactive.gif);
border-bottom-color: white;
}

.shadetabs li a.selected:hover{ /*selected main tab style */
text-decoration: none;
}

.tabcontent{
display:none;
}

@media print {
.tabcontent {
display:block !important;
}
}

/* ######### CSS for Inverted Modern Bricks II Tabs. Remove if not using ######### */

.modernbricksmenu2{
padding: 0;
width: 362px;
border-top: 5px solid #D25A0B; /*Brown color theme*/
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}

.modernbricksmenu2 ul{
margin:0;
margin-left: 10px; /*margin between first menu item and left browser edge*/
padding: 0;
list-style: none;
}

.modernbricksmenu2 li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

.modernbricksmenu2 a{
float: left;
display: block;
font: bold 11px Arial;
color: white;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px;
background-color: black; /*Brown color theme*/
border-top: 1px solid white;
}

.modernbricksmenu2 a:hover{
background-color: #D25A0B; /*Brown color theme*/
color: white;
}

.modernbricksmenu2 a.selected{ /*currently selected tab*/
background-color: #D25A0B; /*Brown color theme*/
color: white;
border-color: #D25A0B; /*Brown color theme*/
}

.tabcontent{
display:none;
}

@media print {
.tabcontent {
display:block !important;
}
}

/* ######### CSS for Indented CSS Tabs. Remove if not using ######### */

.indentmenu{
font: bold 13px Arial;
width: 100%; /*leave this value as is in most cases*/
}

.indentmenu ul{
margin: 0;
padding: 0;
float: left;
/* width: 80%; width of menu*/
border-top: 1px solid navy; /*navy border*/
background: black url(indentbg.gif) center center repeat-x;
}

.indentmenu ul li{
display: inline;
}

.indentmenu ul li a{
float: left;
color: white; /*text color*/
padding: 5px 11px;
text-decoration: none;
border-right: 1px solid navy; /*navy divider between menu items*/
}

.indentmenu ul li a:visited{
color: white;
}

.indentmenu ul li a.selected{
color: white !important;
padding-top: 6px; /*shift text down 1px*/
padding-bottom: 4px;
background: black url(indentbg2.gif) center center repeat-x;
}

.tabcontentstyle{ /*style of tab content oontainer*/
border: 1px solid gray;
width: 450px;
margin-bottom: 1em;
padding: 10px;
}

.tabcontent{
display:none;
}

@media print {
.tabcontent {
display:block !important;
}

</style>

<script type="text/javascript" />

//** Tab Content script v2.0- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
//** Updated Oct 7th, 07 to version 2.0. Contains numerous improvements:
// -Added Auto Mode: Script auto rotates the tabs based on an interval, until a tab is explicitly selected
// -Ability to expand/contract arbitrary DIVs on the page as the tabbed content is expanded/ contracted
// -Ability to dynamically select a tab either based on its position within its peers, or its ID attribute (give the target tab one 1st)
// -Ability to set where the CSS classname "selected" get assigned- either to the target tab's link ("A"), or its parent container
//** Updated Feb 18th, 08 to version 2.1: Adds a "tabinstance.cycleit(dir)" method to cycle forward or backward between tabs dynamically
//** Updated April 8th, 08 to version 2.2: Adds support for expanding a tab using a URL parameter (ie: http://mysite.com/tabcontent.htm?tabi...)

////NO NEED TO EDIT BELOW////////////////////////

function ddtabcontent(tabinterfaceid){
this.tabinterfaceid=tabinterfaceid //ID of Tab Menu main container
this.tabs=document.getElementById(tabinterfaceid).getElementsByTagName("a") //Get all tab links within container
this.enabletabpersistence=true
this.hottabspositions=[] //Array to store position of tabs that have a "rel" attr defined, relative to all tab links, within container
this.currentTabIndex=0 //Index of currently selected hot tab (tab with sub content) within hottabspositions[] array
this.subcontentids=[] //Array to store ids of the sub contents ("rel" attr values)
this.revcontentids=[] //Array to store ids of arbitrary contents to expand/contact as well ("rev" attr values)
this.selectedClassTarget="link" //keyword to indicate which target element to assign "selected" CSS class ("linkparent" or "link")
}

ddtabcontent.getCookie=function(Name){
var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
if (document.cookie.match(re)) //if cookie found
return document.cookie.match(re)[0].split("=")[1] //return its value
return ""
}

ddtabcontent.setCookie=function(name, value){
document.cookie = name+"="+value+";path=/" //cookie value is domain wide (path=/)
}

ddtabcontent.prototype={

expandit:function(tabid_or_position){ //PUBLIC function to select a tab either by its ID or position(int) within its peers
this.cancelautorun() //stop auto cycling of tabs (if running)
var tabref=""
try{
if (typeof tabid_or_position=="string" && document.getElementById(tabid_or_position).getAttribute("rel")) //if specified tab contains "rel" attr
tabref=document.getElementById(tabid_or_position)
else if (parseInt(tabid_or_position)!=NaN && this.tabs[tabid_or_position].getAttribute("rel")) //if specified tab contains "rel" attr
tabref=this.tabs[tabid_or_position]
}
catch(err){alert("Invalid Tab ID or position entered!")}
if (tabref!="") //if a valid tab is found based on function parameter
this.expandtab(tabref) //expand this tab
},

cycleit:function(dir, autorun){ //PUBLIC function to move foward or backwards through each hot tab (tabinstance.cycleit('foward/back') )
if (dir=="next"){
var currentTabIndex=(this.currentTabIndex<this.hottabspositions.length-1)? this.currentTabIndex+1 : 0
}
else if (dir=="prev"){
var currentTabIndex=(this.currentTabIndex>0)? this.currentTabIndex-1 : this.hottabspositions.length-1
}
if (typeof autorun=="undefined") //if cycleit() is being called by user, versus autorun() function
this.cancelautorun() //stop auto cycling of tabs (if running)
this.expandtab(this.tabs[this.hottabspositions[currentTabIndex]])
},

setpersist:function(bool){ //PUBLIC function to toggle persistence feature
this.enabletabpersistence=bool
},

setselectedClassTarget:function(objstr){ //PUBLIC function to set which target element to assign "selected" CSS class ("linkparent" or "link")
this.selectedClassTarget=objstr || "link"
},

getselectedClassTarget:function(tabref){ //Returns target element to assign "selected" CSS class to
return (this.selectedClassTarget==("linkparent".toLowerCase()))? tabref.parentNode : tabref
},

urlparamselect:function(tabinterfaceid){
var result=window.location.search.match(new RegExp(tabinterfaceid+"=(\\d+)", "i")) //check for "?tabinterfaceid=2" in URL
return (result==null)? null : parseInt(RegExp.$1) //returns null or index, where index (int) is the selected tab's index
},

expandtab:function(tabref){
var subcontentid=tabref.getAttribute("rel") //Get id of subcontent to expand
//Get "rev" attr as a string of IDs in the format ",john,george,trey,etc," to easily search through
var associatedrevids=(tabref.getAttribute("rev"))? ","+tabref.getAttribute("rev").replace(/\s+/, "")+"," : ""
this.expandsubcontent(subcontentid)
this.expandrevcontent(associatedrevids)
for (var i=0; i<this.tabs.length; i++){ //Loop through all tabs, and assign only the selected tab the CSS class "selected"
this.getselectedClassTarget(this.tabs[i]).className=(this.tabs[i].getAttribute("rel")==subcontentid)? "selected" : ""
}
if (this.enabletabpersistence) //if persistence enabled, save selected tab position(int) relative to its peers
ddtabcontent.setCookie(this.tabinterfaceid, tabref.tabposition)
this.setcurrenttabindex(tabref.tabposition) //remember position of selected tab within hottabspositions[] array
},

expandsubcontent:function(subcontentid){
for (var i=0; i<this.subcontentids.length; i++){
var subcontent=document.getElementById(this.subcontentids[i]) //cache current subcontent obj (in for loop)
subcontent.style.display=(subcontent.id==subcontentid)? "block" : "none" //"show" or hide sub content based on matching id attr value
}
},

expandrevcontent:function(associatedrevids){
var allrevids=this.revcontentids
for (var i=0; i<allrevids.length; i++){ //Loop through rev attributes for all tabs in this tab interface
//if any values stored within associatedrevids matches one within allrevids, expand that DIV, otherwise, contract it
document.getElementById(allrevids[i]).style.display=(associatedrevids.indexOf(","+allrevids[i]+",")!=-1)? "block" : "none"
}
},

setcurrenttabindex:function(tabposition){ //store current position of tab (within hottabspositions[] array)
for (var i=0; i<this.hottabspositions.length; i++){
if (tabposition==this.hottabspositions[i]){
this.currentTabIndex=i
break
}
}
},

autorun:function(){ //function to auto cycle through and select tabs based on a set interval
this.cycleit('next', true)
},

cancelautorun:function(){
if (typeof this.autoruntimer!="undefined")
clearInterval(this.autoruntimer)
},

init:function(automodeperiod){
var persistedtab=ddtabcontent.getCookie(this.tabinterfaceid) //get position of persisted tab (applicable if persistence is enabled)
var selectedtab=-1 //Currently selected tab index (-1 meaning none)
var selectedtabfromurl=this.urlparamselect(this.tabinterfaceid) //returns null or index from: tabcontent.htm?tabinterfaceid=index
this.automodeperiod=automodeperiod || 0
for (var i=0; i<this.tabs.length; i++){
this.tabs[i].tabposition=i //remember position of tab relative to its peers
if (this.tabs[i].getAttribute("rel")){
var tabinstance=this
this.hottabspositions[this.hottabspositions.length]=i //store position of "hot" tab ("rel" attr defined) relative to its peers
this.subcontentids[this.subcontentids.length]=this.tabs[i].getAttribute("rel") //store id of sub content ("rel" attr value)
this.tabs[i].onclick=function(){
tabinstance.expandtab(this)
tabinstance.cancelautorun() //stop auto cycling of tabs (if running)
return false
}
if (this.tabs[i].getAttribute("rev")){ //if "rev" attr defined, store each value within "rev" as an array element
this.revcontentids=this.revcontentids.concat(this.tabs[i].getAttribute("rev").split(/\s*,\s*/))
}
if (selectedtabfromurl==i || this.enabletabpersistence && selectedtab==-1 && parseInt(persistedtab)==i || !this.enabletabpersistence && selectedtab==-1 && this.getselectedClassTarget(this.tabs[i]).className=="selected"){
selectedtab=i //Selected tab index, if found
}
}
} //END for loop
if (selectedtab!=-1) //if a valid default selected tab index is found
this.expandtab(this.tabs[selectedtab]) //expand selected tab (either from URL parameter, persistent feature, or class="selected" class)
else //if no valid default selected index found
this.expandtab(this.tabs[this.hottabspositions[0]]) //Just select first tab that contains a "rel" attr
if (parseInt(this.automodeperiod)>500 && this.hottabspositions.length>1){
this.autoruntimer=setInterval(function(){tabinstance.autorun()}, this.automodeperiod)
}
} //END int() function

} //END Prototype assignment

/***********************************************
* Tab Content script v2.2- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

-->

Then click save. After that add another html widget where you want the tabbed content to go, and place this code inside it:

<!--

<h3>Demo #1- Basic implementation</h3>

<ul id="countrytabs" class="shadetabs">
<li><a href="#" rel="country1" class="selected">Tab 1</a></li>
<li><a href="#" rel="country2">Tab 2</a></li>
<li><a href="#" rel="country3">Tab 3</a></li>
<li><a href="#" rel="country4">Tab 4</a></li>
<li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
</ul>

<div style="border:1px solid gray; width:450px; margin-bottom: 1em; padding: 10px">

<div id="country1" class="tabcontent">
Tab content 1 here<br />Tab content 1 here<br />
</div>

<div id="country2" class="tabcontent">
Tab content 2 here<br />Tab content 2 here<br />
</div>

<div id="country3" class="tabcontent">
Tab content 3 here<br />Tab content 3 here<br />
</div>

<div id="country4" class="tabcontent">
Tab content 4 here<br />Tab content 4 here<br />
</div>

</div>

<script type="text/javascript">

var countries=new ddtabcontent("countrytabs")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()

</script>

<p><a href="javascript:countries.cycleit('prev')" style="margin-right: 25px; text-decoration:none">Back</a> <a href="javascript: countries.expandit(3)">Click here to select last tab</a> <a href="javascript:countries.cycleit('next')" style="margin-left: 25px; text-decoration:none">Forward</a></p>

<script type="text/javascript">

var mypets=new ddtabcontent("pettabs")
mypets.setpersist(true)
mypets.setselectedClassTarget("link")
mypets.init(2000)

</script>

-->

(Remember to leave out the <!-- and --> !)

This should get you the basics of it, and you need to personalize it to your own requirements. Also check out the DynamicDrive page to see the variables.
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Thanks Connor for your awesome help on this! =)
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Yup Thanks Connor. This really helped me out.Thank you very much
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Ok im back unfortunatly

I tried the codeing but it doesn't work.

Iv found another one - http://www.javascriptkit.com/script/s...

Iv tried this but still with no success it doesn't work

My aim - Is to create a drop down bar. help please.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
I know Yola hasnt yet have a sign up or register feature - But can we create our own from another website?Or program?

E.g Microsoft office access 2007 - You can create datbases and forms on there?
Photo of Ruth

Ruth

  • 2819 Posts
  • 135 Reply Likes
Hi BloodMoney,

You may wish to try out Google Friend Connect. You can find more information about it here: http://www.yola.com/tutorials/google-...

Let us know if this is not what you have in mind.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Hey Ruth
With Google Friend Connect will people be able to sign up to my website?
Photo of Ruth

Ruth

  • 2819 Posts
  • 135 Reply Likes
Yes, they will be able to sign up and become members on your site.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Great. Thanks Ruth App added.

I want to add this -http://www.avivadirectory.com/photosh... to my website to make it look professional any way of doing this?

The template im currently using is called - Clean Slate Black.

Thanks
Photo of Ruth

Ruth

  • 2819 Posts
  • 135 Reply Likes
For something to be used in Yola it either needs to be made in Yola, or added using HTML and the HTML widget. I had a quick look at your link, and couldn't see an HTML embed code. It's not possible to upload pages that have been built elsewhere.

One of our champs may be able to help you out with a similar look using HTML if you can give more details.
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Great - What more information can I give? Thanks Ruth

Is there anyway we can add a forum to our website?
Photo of Marije

Marije, Official Rep

  • 4636 Posts
  • 237 Reply Likes
Hey there, here's some info on adding a forum: http://www.yola.com/customer-support/.... I would recommend nabble.com...
Photo of BloodMoney

BloodMoney

  • 27 Posts
  • 0 Reply Likes
Is there anyway of adding a PhpBB2 forum on Yola?
Made from here - http://www.myfreeforum.org/
Photo of Marije

Marije, Official Rep

  • 4636 Posts
  • 237 Reply Likes
As far as I know PhpBB2 requires you to FTP files to your site which isn't possible on Yola. Feel free to post some links to their installation info and I can confirm for you.
Photo of John McCarthy

John McCarthy

  • 1292 Posts
  • 99 Reply Likes
im not sure if this will work but
1) drag a html widget onto your selected page
2)copy and paste the following code

-->

and where it says
http://your_forum_url.com
replace it with yoor forums url hope this helps