Stap 1: Aanmaken van forum.
Je maakt natuurlijk eerst een forum aan op: http://s3.invisionfree.com/in/register.php
Stap 2: Het bewerken van de skin.
Deze stap kan uren duren voor kieskeurige types ^^
Je gaat eerst naar skins zoeken
Ik ga hiervoor naar bijv. Enhanced Dark en zoek daar een skin uit.
ik kies in mijn geval "Apocament"
Ga naar dat topic. en houd het controlpanel (cp) voor je.
Om je skin te vervangen heb je 2 stappen. (omdat er 2codes staan)
Eerst staat er een code voor je "header"
Ga hiervoor in je cp naar Skinning & Styles > Board Wrappers
en vervang het voor deze code:
Code: Selecteer alles
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000"><body text="#000000" link="#000000" vlink="#000000" alink="#000000" leftmargin="2" topmargin="2" marginwidth="2" marginheight="0">
<table width="812" border="1" align="center" cellpadding="4" cellspacing="0" bgcolor="#FFFFFF" height="378" bordercolor="#0F0F0F">
<tr>
<td width="90%" height="100%" bgcolor="#0F0F0F">
<% BOARD HEADER %>
<% NAVIGATION %>
<% BOARD %>
<% STATS %>Ga hiervoor naar: Skinning & Styles > Manage Style Sheets
En vervang het door deze code:
Code: Selecteer alles
html { overflow-x: hidden; overflow-y: auto; }
form { display:inline; }
img { vertical-align:middle; border:0px }
BODY { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 10px; color: #6E6E6E; margin:0px 10px 0px 10px;background-color:#000;background-image: url(http://209.85.48.10/2857/0/upload/p249661.gif); }
TABLE, TR, TD { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 10px; color: #6E6E6E; }
a:link, a:visited, a:active { text-decoration: none; color: #858585 }
a:hover { color: #707070; text-decoration:underline }
fieldset.search { padding:6px; line-height:150% }
label { cursor:pointer; }
img.attach { border:2px outset #3A493F;padding:2px }
.googleroot { padding:6px; line-height:130% }
.googleparent { padding:6px; margin-left:30px; line-height:130%; color:#91698 }
.googlechild { padding:6px; margin-left:30px; line-height:130% }
.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size:11px; color: #3A4F6C; }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:14px; font-weight:bold; color:#00D; }
.googlepagelinks { font-size:1.1em; letter-spacing:1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:10px; color:#434951 }
li.helprow { padding:0px; margin:0px 0px 10px 0px }
ul#help { padding:0px 0px 0px 15px }
option.cat { font-weight:bold; }
option.sub { font-weight:bold;color:#000 }
.caldate { text-align:right;font-weight:bold;font-size:10px;color:#646464; background-image: url(http://209.85.48.10/2857/0/upload/p248332.gif); padding:4px;margin:0px;border-bottom:1px solid #070707; }
.warngood { color:green }
.warnbad { color:red }
#padandcenter { margin-left:auto;margin-right:auto;text-align:center;padding:14px 0px 14px 0px }
#profilename { font-size:28px; font-weight:bold; }
#calendarname { font-size:22px; font-weight:bold; }
#photowrap { padding:6px; }
#phototitle { font-size:24px; border-bottom:1px solid black }
#photoimg { text-align:center; margin-top:15px }
#ucpmenu { line-height:150%;width:22%; border:1px solid #070707;background-color: #191919 }
#ucpmenu p { padding:2px 5px 6px 9px;margin:0px; }
#ucpcontent { background-color: #191919; border:1px solid #070707;line-height:150%; width:auto }
#ucpcontent p { padding:10px;margin:0px; }
#ipsbanner { position:absolute;top:1px;right:5%; }
#logostrip { border:1px solid #070707;background-color: #151515;background-image:url(http://); padding:0px;margin:0px; }
#submenu { border:1px solid #070707;background-image: url(http://209.85.48.10/2857/0/upload/p248988.gif); background-color:#151515; font-size:10px;margin:3px 0px 3px 0px;color:#858585;font-weight:bold; }
#submenu a:link, #submenu a:visited, #submenu a:active { font-weight:bold;font-size:10px;text-decoration: none; color: #858585; }
#submenu a:hover { color:#707070;text-decoration:none; }
#userlinks { border:1px solid #070707; background-image: url(http://209.85.48.10/2857/0/upload/p248332.gif); }
#navstrip { font-weight:bold;padding:6px 0px 6px 0px; }
.activeuserstrip { background-image: url(http://209.85.48.10/2857/0/upload/p248332.gif);border:1px solid #070707; padding:4px }
.pformstrip { background-image: url(http://209.85.48.10/2857/0/upload/p248332.gif); color:#6E6E6E;font-weight:bold;padding:4px;margin-top:1px }
.pformleft { background-color: #191919; padding:6px; margin-top:1px;width:25%; border-top:1px solid #070707; border-right:1px solid #070707;border-left:1px solid #070707; }
.pformleftw { background-color: #191919; padding:6px; margin-top:1px;width:40%; border-top:1px solid #070707; border-right:1px solid #070707; }
.pformright { background-color: #191919; padding:6px; margin-top:1px;border-top:1px solid #070707;border-right:1px solid #070707; }
.post1 { background-color: #191919 }
.post2 { background-color: #191919 }
.postlinksbar { text-align:center; padding:4px;margin-top:1px;font-size:9px; background-image: url(http://209.85.48.10/2857/0/upload/p248332.gif);border-left:1px solid #070707;border-right:1px solid #070707; }
.row1 { background-color: #191919 }
.row2 { background-color: #191919 }
.row3 { background-color: #191919 }
.row4 { background-color: #191919 }
.darkrow1 { background-color: #0F0F0F; color:#6E6E6E; }
.darkrow2 { background-color:#141414; padding:2px; color:#6E6E6E; }
.darkrow3 { background-color:#141414; color:#6E6E6E; }
.hlight { background-color: #191919 }
.dlight { background-color: #191919 }
.titlemedium { font-weight:bold; color:#6E6E6E; padding:4px; margin:0px; background-image: url(http://209.85.48.10/2857/0/upload/p248332.gif) }
.titlemedium a:link, .titlemedium a:visited, .titlemedium a:active { text-decoration: underline; color: #6E6E6E }
.maintitle { text-align:center;
vertical-align:middle;font-weight:normal;font-size:10px; color:#6E6E6E; letter-spacing:1px; padding:6px 0px 6px 5px; background-image: url(http://209.85.48.10/2857/0/upload/p248141.gif); background-position:center; background-repeat:no-repeat; }
.maintitle a:link, .maintitle a:visited, .maintitle a:active { text-decoration: none; color: #6E6E6E;font-size:10px;font-weight:normal; }
.maintitle a:hover { text-decoration: underline; font-size:10px;font-weight:normal; }
.plainborder { border:1px solid #121212;background-color:#070707 }
.tableborder { border:0px solid #121212;background-color:#070707; padding:0px; margin:0px; width:100% }
.tablefill { border:1px solid #070707;background-color:#282828;padding:6px; }
.tablepad { background-color:#191919;border:1px solid #070707;padding:6px }
.tablebasic { width:100%; padding:0px 0px 0px 0px; margin:0px; border:0px }
div.row4 { border-color: #070707!important;}
.wrapmini { float:left;line-height:1.5em;width:25% }
.pagelinks { float:left;line-height:1.2em;width:35% }
.desc { font-size:10px; color:#646464 }
.edit { font-size: 9px; color:#646464 }
.signature { font-size: 10px; color: #646464 }
.postdetails { font-size: 10px; color: #646464 }
.postcolor { font-size: 11px; line-height: 160% }
.normalname { font-size: 12px; font-weight: bold; color: #003 }
.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 12pxC:Z00; }
.unreg { font-size: 10px; font-weight: normal; color: #760000 }
.searchlite { font-weight:bold; color:#F00; background-color:#FF0 }
#QUOTE { font-family: Verdana, Arial; font-size: 10px; color: #646464; background-color: #151515; border: 1px solid #070707; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }
#CODE { font-family: Courier, Courier New, Verdana, Arial; font-size: 11px; color: #646464; background-color: #151515; border: 1px solid #070707; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }
.copyright { font-family: Verdana, Tahoma, Arial, Sans-Serif; font-size: 9px; line-height: 12px }
</style><center>Skin <b>Apocament</b> designed by <b>Zeus00</b> of the <b><a href="http://invisionfree.com/forums/ifskinzone/index.php" target="_blank">IF Skin Zone</a></b>.</center><style type='text/css'>
.codebuttons { font-size: 10px; color:#858585; font-family: verdana, helvetica, sans-serif; vertical-align: middle;background-color:#181818;background-image: url(http://209.85.48.10/2857/0/upload/p248332.gif);border:1px solid #070707; }
.forminput, .textinput, .radiobutton, .checkbox { font-size: 10px; font-family: verdana, helvetica, sans-serif; vertical-align: middle;color:#646464;border:1px solid #070707;background-color:#282828; }
.thin { padding:6px 0px 6px 0px;line-height:140%;margin:2px 0px 2px 0px;border-top:1px solid #000;border-bottom:1px solid #000 }
.purple { color:purple;font-weight:bold }
.red { color:red;font-weight:bold }
.green { color:green;font-weight:bold }
.blue { color:blue;font-weight:bold }
.orange { color:#F90;font-weight:bold }
</style><script language='javascript'>
if ( location.search.indexOf('Post&CODE')!=-1 ){document.write("<style>.pformstrip { border-top:1px solid #070707 }}</style>")}
</script>
</style><script language='javascript'>
if ( location.search.indexOf('UserCP&CODE')!=-1 ){document.write("<style>.pformstrip { border-top:1px solid #070707 }}</style>")}
</script>
Als je goed kijkt zie je in het topic waar je je style vandaan haalt ook een download met buttons en markers.
Markers geven aan of er een nieuw bericht is geplaatst.
En buttons geven je "add reply" etc een mooi buitenkantje.
Hoe zet ik ze op mijn forum?:
Je hebt hiervoor 2dingen nodig.
Imageshack
En "Skinning & Styles > Images" van je cp.
Dit is een heel upload karweitje.
Je upload het plaatje. en kopieert de directe link.
Zorg dat het je Standaard plaatje vervangt.
(Boxje aanvinken,onder scrollen en dan use replacement, submit)
Stap 4. De extra's voor jouw forum:
Als je van die scolling boxes etc wilt moet je het volgende doen:
Ga Naar Coding suport van invisionfree
Druk bijv op "Announcement, News, and Welcome Boxes"
Kies daar een newsbox or whatever uit.
Druk bijv. op "Scrolling Announcement Box"
zet dan die code onder <% Navigation %> bij Board Wrappers.
(Skinning & Styles > Board Wrappers in cp)
Vaak staan wel in het topic waar die codes moeten.
Dus je hoeft meestal niet bang te zijn dat je het verknalt.
Dit is de basis. Voor als je een forum maakt met IF.
Ik heb dit makkelijk gehouden omdat ik geen zin had om screens te maken. Als dit echt zo'n onduidelijke guide is, Maak ik wel screens en een preview.
Als je nog vragen hebt kan je me altijd pme.
