How to make a shop like this?

I want to make a shop like this for my forum. Do you know how? http://www.wizard101central.com/forums/vbshop.php

It requires a login, please explain what kind of shop is it? I mean its functionality wise?

Ok. It has the items you want to purchase. It has a buy button and it works with forum points. When you have enough points and you click the buy button you get the item and the points minus instantly. And on the side it has a cart where you it tells you the item you bought and the total forum points it cost. For example one of the item can be a name change or a name style.

Hi,

Seeing that its vBulletin, it won't be possible in Forumotion. You can create an HTML page where it can redirect them to create a post in a thread to let the Admins know what item they wish since it cannot be set automatically.

So how do i make it. I need steps how to do it.

Make a thread, display hoe much each item would cost.
Then users reply to that thread with what they want to buy, so you can deduct the points & provide them with whatever they brought.

Sir Chivas wrote:Hi,

Seeing that its vBulletin, it won't be possible in Forumotion. You can create an HTML page where it can redirect them to create a post in a thread to let the Admins know what item they wish since it cannot be set automatically.

Yes that sounds like the best way to go about it

You can also create something like this:
http://mycoding.forumotion.com/h30-myshop


Codes:

HTML (ACP >> Modules >> HTML Pages Management)

Code:

<div class="box-content clearfix">
<br><div class="borderwrap thumbnails" style="width: 22.5%;"><div class="thumbwrap"><div class="thumb"><div class="thumbnail">
<img src="http://i21.servimg.com/u/f21/14/41/92/25/1310.png" alt="" title="" style="border: 1px dashed #CCCCCC; padding: 6px;">
</div><div class="gal_caption">
<font>
<font>Premium
</font>
</font><br><br><hr><br>
<center><font><font>
Price: 10000 coins
</font></font><br><br><hr>
<br><a class="button" style="font-weight:normal;" href="/h3-premium"><font><font>Buy</font></font></a></center></div></div></div></div><div class="borderwrap thumbnails" style="width: 22.5%;"><div class="thumbwrap"><div class="thumb"><div class="thumbnail"><img src="http://i41.servimg.com/u/f41/14/41/92/25/shoppi10.png" alt="" title="" style="border: 1px dashed #CCCCCC; padding: 6px;"></div><div class="gal_caption"><font><font>Change of username</font></font><br><br><hr><br><center><font><font>Price: 600 coins </font></font><br><br><hr><br><a class="button" style="font-weight:normal;" href="/h234-byte-av-anvandarnamn"><font><font>Buy</font></font></a></center></div></div></div></div><div class="borderwrap thumbnails" style="width: 22.5%;"><div class="thumbwrap"><div class="thumb"><div class="thumbnail"><img src="http://i41.servimg.com/u/f41/14/41/92/25/shoppi10.png" alt="" title="" style="border: 1px dashed #CCCCCC; padding: 6px;"></div><div class="gal_caption"><font><font>Change of rank</font></font><br><br><hr><br><center><font><font>Price: 700 coins </font></font><br><br><hr><br><a class="button" style="font-weight:normal;" href="/h235-byte-av-rank"><font><font>Buy</font></font></a></center></div></div></div></div><div class="borderwrap thumbnails" style="width: 22.5%;"><div class="thumbwrap"><div class="thumb"><div class="thumbnail"><img src="http://i41.servimg.com/u/f41/14/41/92/25/shoppi10.png" alt="" title="" style="border: 1px dashed #CCCCCC; padding: 6px;"></div><div class="gal_caption"><font><font>Removal of warnings</font></font><br><br><hr><br><center><font><font>Price: 4000 coins </font></font><br><br><hr><br><a class="button" style="font-weight:normal;" href="/h236-borttagning-av-varningar"><font><font class="">Buy</font></font></a></center></div></div></div></div>

 </div>

CSS: (ACP >> Display >> Colors >> CSS Stylesheet [tab])

Code:


a.button {
padding: 6px 8px;
-webkit-border-radius: 3px 3px;
-moz-border-radius: 3px 3px;
border: solid 1px rgb(153, 153, 153);
background-image: url('http://i71.servimg.com/u/f31/14/41/92/25/4bff2711.png');
background-repeat: repeat-x;
background-position: bottom;
background-color: #ffffff;
color: #333;
text-decoration: none;
display: inline-block;
text-align: center;
text-shadow: 0px 1px 1px rgba(255,255,255,1);
cursor: url(http://kafansite.webs.com/cur531.cur), auto;
border-image: initial;
}
.box-content {
border-bottom: 0px solid #666666;
background-color: #F4FFF2;
}
.borderwrap.thumbnails {
float: left;
margin: 0 5px 5px 5px;
margin-top: -9px;
}
div.borderwrap, .borderwrapm {
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0.36, rgb(237,247,234)),color-stop(0.68, rgb(244,255,242)));
background-image: -moz-linear-gradient(center bottom,rgb(237,247,234) 36%,rgb(244,255,242) 68%);
}
div.borderwrap, .borderwrapm {
border: 1px solid #c6ccd4;
background-color: ;
background-repeat: repeat-x;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-box-shadow: 0 0 6px #b5b5b5;
-webkit-box-shadow: 0 0 6px #b5b5b5;
border-image: initial;
}
div.borderwrap, .borderwrapm {
padding: 1px;
width: auto;
}
.borderwrapm, div.borderwrap {
background-color: #fff;
border: 1px solid #;
padding: 1px;
}
.borderwrap.thumbnails .thumbwrap {
border: none;
border-image: initial;
}
.borderwrap.thumbnails .thumb {
min-height: 130px;
}
.borderwrap.thumbnails .thumbnail img {
background-color: #fff;
border: 1px solid #c6ccd4 !important;
border-image: initial;
}

.borderwrap.thumbnails .thumbnail img {
display: block;
margin: 0.5em auto;
padding: 2px 2px 12px 2px;
text-align: center;
height: 75px;
}
.borderwrap.thumbnails .thumbnail img {
background-color: #fff;
border: 1px solid #0a0a0a!important;
display: block;
height: 75px;
margin: .5em auto;
padding: 2px 2px 12px;
text-align: center;
border-image: initial;
}
.borderwrap.thumbnails .gal_caption {
margin: 0 auto 1em;
text-align: center;
font-size: 11px;
font-weight: bold;
}

Creator: Nathan Adhitya

Um i kinda like it but not really what i like sorry.

Well, I'm sorry, mate. Those are you're only options, if you want you can suggest it here.