miikerocks 0 Report post Posted July 16, 2008 Azurian forum style for invisionfree forum. For preview of this skin visit: z11.invisionfree.com/FreeLoads To install this skin, the writing in red must be changed. yourBOARDNAMEhere has to be changed to urs (such as mine is FreeLoads), and the z11 in red has to be yours (yours couls be z4). For help removing the miikerocks copyright and replacing with your own, seek my other tutorials. There are to header and body's-one for the style only, the other is my configuration - (the style with music and message flasher added.) There is also 2 footers-One just for the style, the other for the style AND with doHTML button added to the reply list (BB code) Put this in style sheets (CSS of forum): 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: #8b8a8a; margin: px px px px; background-color:#e4e4e4; background-image: url(http://) }TABLE, TR, TD { font-family: Verdana, Tahoma; Arial; sans-serif; font-size: 10px; color: #8b8a8a; }BODY { scrollbar-face-color: #6798AD;scrollbar-shadow-color: #282828;scrollbar-highlight-color: #282828;scrollbar-3dlight-color: #323232;scrollbar-darkshadow-color: #000000;scrollbar-track-color: #141414;scrollbar-arrow-color: #004070}a:link, a:visited, a:active { text-decoration: underline; color: #000000 }a:hover { color: #6597ac; text-decoration:none }fieldset.search { padding:6px; line-height:150% }label { cursor:pointer; }img.attach { border:2px outset #EEF2F7;padding:2px }#ipbwrapper { text-align:left; width:95%; margin-left:auto;margin-right:auto }#ipbwrapper img { vertical-align:middle; border: 0px }.googleroot { padding:6px; line-height:130% }.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:#555 }.caldate { text-align:right;font-weight:bold;font-size:11px;color:#8b8a8a;background-color:#f2f2f2; background-image: url(http://);padding:4px;margin:0px }.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 #dcdcdc;background-color: #f2f2f2; background-image: url(http://) }#ucpmenu p { padding:2px 5px 6px 9px;margin:0px; }#ucpcontent { background-color: #f2f2f2; background-image: url(http://); border:1px solid #dcdcdc;line-height:150%; width:auto }#ucpcontent p { padding:10px;margin:0px; }#ipsbanner { position:absolute;top:1px;right:5%; }#logostrip { border:0px solid #dcdcdc;background-color: #f2f2f2;background-image:url(http://);padding:0px;margin:0px; }/* Skin Created using the Premium CSS Generator at http://ifskinzone.net/main.php */#submenu { border:1px solid #dcdcdc;background-color: #f2f2f2; background-image: url(http://); font-size:10px;margin:3px 0px 3px 0px;color:#8b8a8a;font-weight:bold;}#submenu a:link, #submenu a:visited, #submenu a:active { font-weight:bold;font-size:10px;text-decoration: none; color: #000000; }#submenu {display:none; }#userlinks { border:1px solid #dcdcdc; background-color: #f2f2f2; background-image: url(http://img390.imageshack.us/img390/2514/userlinksii5.png) }#navstrip { font-weight:bold;padding:6px 0px 6px 0px; }.adam {Created by Adam of InkDrop Styles}.activeuserstrip { background-color:#f2f2f2; background-image: url(http://img425.imageshack.us/img425/9758/titlemedwg9.png); padding:6px }.pformstrip { background-color: #f2f2f2; background-image: url(http://img86.imageshack.us/img86/3797/pformtu3.png); color:#ffffff;font-weight:bold;padding:7px;margin-top:1px }.pformleft { background-color: #f2f2f2; background-image: url(http://); padding:6px; margin-top:1px;width:25%; border-top:1px solid #dcdcdc; border-right:1px solid #dcdcdc; }.pformleftw { background-color: #f2f2f2; background-image: url(http://); padding:6px; margin-top:1px;width:40%; border-top:1px solid #dcdcdc; border-right:1px solid #dcdcdc; }.pformright { background-color: #f2f2f2; background-image: url(http://); padding:6px; margin-top:1px;border-top:1px solid #dcdcdc; }.post1 { background-color: #f2f2f2; background-image: url(http://); border:1px solid #e9e9e9 }.post2 { background-color: #f2f2f2; background-image: url(http://); border:1px solid #e9e9e9 }.postlinksbar { background-color:#f2f2f2;padding:7px;margin-top:1px;font-size:10px; background-image: url(http://img116.imageshack.us/img116/1872/postlinksbartc9.png) }.row1 { background-color: #F2F2F2; border:1px solid #d6d5d5 }.row2 { background-color: #F2F2F2; border-top:1px solid #d6d5d5; border-left:1px solid #d6d5d5; }.row3 { background-color: #F2F2F2; border:1px solid #d6d5d5 }.row4 { background-color: #F2F2F2; border-top:1px solid #d6d5d5; border-right:1px solid #d6d5d5; } div.row4 { background-color: #F2f2f2; border:1px solid #cacaca; background-image: url(http://img417.imageshack.us/img417/1070/divrow4ki3.png); background-repeat: repeat-x; background-position: top; }.darkrow1 { background-color: #f2f2f2; background-image: url(http://); color:#8b8a8a; }.darkrow2 { background-color: #f2f2f2; background-image: url(http://img161.imageshack.us/img161/7786/darkrow2vh1.png); color:#8b8a8a; }.darkrow3 { background-color: #f2f2f2; background-image: url(http://); color:#8b8a8a; }div.darkrow1 { background-color: #6597ac; }div.caldate { background-color: #F2f2f2; border:1px solid #cacaca; background-image: url(http://img417.imageshack.us/img417/1070/divrow4ki3.png); background-repeat: repeat-x; background-position: top; } .hlight { background-color: #f2f2f2; background-image: url(http://) }.dlight { background-color: #f2f2f2; background-image: url(http://) }.titlemedium { font-weight:bold; color:#828181; padding:3px; margin:0px; background-color: #f2f2f2; background-image: url(http://img179.imageshack.us/img179/3315/titlemediumvt2.png)'>http://img179.imageshack.us/img179/3315/titlemediumvt2.png) }.titlemedium a:link, .titlemedium a:visited, .titlemedium a:active { text-decoration: underline; color: #828181; border-bottom:1px solid #dcdcdc; border-left: 1px solid #e9e9e9; border-right: 1px solid #e9e9e9; }#ipbwrapper div.tableborder div.maintitle, .maintitle { text-align:center; font-weight:bold; color:#f2f2f2; letter-spacing:1px; padding:8px 0px 8px 5px; background-color: #f2f2f2; background-image: url(http://img395.imageshack.us/img395/3262/maintitlemiddleib2.png);background-repeat: repeat-x; background-position: top; }.maintitle a { text-decoration: none; color: #ffffff; }.maintitle a:hover {text-decoration: none; }div.tableborder div.maintitle { padding: 0px; }.maintitle .left { border: 0px; background: no-repeat top left url(http://img490.imageshack.us/img490/9489/maintitleleftup4.png); }.maintitle .right { border: 0px; background: no-repeat top right url(http://img465.imageshack.us/img465/5981/maintitlerightsc0.png); height: auto; }.maintitle .text { border: 0px; padding: 7px 0px 9px 0px; }.plainborder { border:1px solid transparent;background-color:transparent }.tableborder { border: 0px; background: url(http://img518.imageshack.us/img518/987/tablebordermiddlebd6.png); background-repeat: repeat-x; background-position: bottom;; #f2f2f2; }.left { overflow: hidden; border: 0px; background: no-repeat left url(http://img518.imageshack.us/img518/1539/tableborderleftzg0.png); }.right { overflow: hidden; border: 0px; background: no-repeat right url(http://img518.imageshack.us/img518/1708/tableborderrightwf6.png); height: 11px; }div.tableborder {border:1 px solid #cacaca; }.tablefill { border:1px solid #dcdcdc;background-color:#f2f2f2; background-image: url(http://);padding:6px; }.tablepad { background-color:#f2f2f2; background-image: url(http://);padding:6px }.tablebasic { width:100%; padding:0px 0px 0px 0px; margin:0px; border:0px }.wrapmini { float:left;line-height:1.5em;width:25% }.pagelinks { float:left;line-height:1.2em;width:35% }.desc { font-size:10px; color:#8b8a8a }.edit { font-size: 9px }.signature { font-size: 10px; color: #8b8a8a }.postdetails { font-size: 10px }.postcolor { font-size: 12px; line-height: 160% }.normalname { font-size: 12px; font-weight: bold; color: #003 }.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 12px }.unreg { font-size: 11px; font-weight: bold; color: #900 }.searchlite { font-weight:bold; color:#F00; background-color:#FF0 }#QUOTE { font-family: Verdana, Arial; font-size: 11px; color: #8b8a8a; background-color: #f1f1f1; background-image: url(http://img484.imageshack.us/img484/7632/quotehx5.png);background-repeat:repeat-x; border: 1px solid #cac8c8; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }#CODE { font-family: Courier, Courier New, Verdana, Arial; font-size: 11px; color: #8b8a8a; background-color: #f1f1f1; background-image: url(http://img484.imageshack.us/img484/7632/quotehx5.png);;background-repeat:repeat-x; border: 1px solid #cac8c8; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }.codetop {margin-bottom:2px;text-align:center;border:1px solid #c7c7c7;background-color:fff;background-position:top;background-repeat:repeat-x;background-image:url(http://img101.imageshack.us/img101/2008/codequotexf6.png)}.quotetop {margin-bottom:2px;text-align:center;border:1px solid #c7c7c7; background-color:fff;background-position:top;background-repeat:repeat-x;background-image:url(http://img101.imageshack.us/img101/2008/codequotexf6.png)}.copyright { font-family: Verdana, Tahoma, Arial, Sans-Serif; font-size: 9px; line-height: 12px }.codebuttons { font-size: 10px; color:#000; font-family: verdana, helvetica, sans-serif; vertical-align: middle;background-color:#f2f2f2; background-image: url( http://img179.imageshack.us/img179/3315/titlemediumvt2.png ); background-position:center;border:1px solid #dcdcdc; }.forminput, .radiobutton, .checkbox, textarea, input { color: #6597ac!important; border:1px solid #c1c1c1; color: #8b8a8a; background-color:#fbfbfb; font-size: 10px; font-family: verdana, helvetica, sans-serif; vertical-align: middle;background-image: url(http://img179.imageshack.us/img179/9317/other1xp6.png); background-position:top;background-repeat:repeat-x; }.textinput { border: px solid #dcdcdc;background-color:#f2f2f2; font-size: 10px; color:#; font-family: verdana, helvetica, sans-serif; vertical-align: middle; background-image: url( http://img409.imageshack.us/img409/9158/input5ch.png ); background-repeat: repeat-x; background-position: top;}.thin { padding:6px 0px 6px 0px;line-height:140%;margin:2px 0px 2px 0px;border-top:1px solid #d6d5d5;border-bottom:1px solid #d6d5d5; }.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 }* html body { <a href=mozilla.com>Get Firefox!</a> }</style><script language='javascript'>if ( location.search.indexOf('Stats')!=-1) {document.write("<style>.pformstrip{ background-image: url(http://img82.imageshack.us/img82/3281/fixnt7.png); } }</style>")}</script><style type="text/css"> Now put this in Header and Body. All stuff in red you MUST edit with your own site info: <center><body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000"> <table cellspacing="0" bgcolor="#f2f2f2" valign="top" width="83%"><tr><td valign="top" background="http://forums.xisto.com/no_longer_exists/404.png; style="padding:18px;border:0px;"></td><td valign="top"> <table width='99%' cellpadding='0' cellspacing='0' align='center'><tr><td> <body bgcolor='#FFFFFF' leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink='#000000' vlink='#000000'> <div class="banner" width="100%"> </center> </div> <table width="100%" > <td class="customsubmenu" align='center' width="100%"> <a STYLE="text-decoration:none" href="http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?"> <img src="http://forums.xisto.com/no_longer_exists/404.png; </a> <a STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=site'> <img src="http://forums.xisto.com/no_longer_exists/404.png STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=Help'> <img src="http://forums.xisto.com/no_longer_exists/404.png STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=Search&f='> <img src="http://forums.xisto.com/no_longer_exists/404.png; </a><a STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=Members'> <img src="http://forums.xisto.com/no_longer_exists/404.png; </a><a STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=calendar'> <img src="http://forums.xisto.com/no_longer_exists/404.png; </td> </table> <% BOARD HEADER %> <% NAVIGATION %> <% BOARD %> <br/> <center><B>©</B> <a href="http://z11.invisionfree.com/FreeLoads/index.php?showuser=1; target="_blank"><B>miikerocks</a></b>-><b><a href="http://z11.invisionfree.com/FreeLoads/index.php; target="_blank">FreeLoads Forum</a></b><p> <text color=white>Part of style by inkdropstyles.com</text color></center> <% STATS %> Now if you want my Header and Body Code which will come also with music and a pm flasher, its below (just replace your board header and body with it): <center><body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000"> <table cellspacing="0" bgcolor="#f2f2f2" valign="top" width="83%"><tr><td valign="top" background="http://forums.xisto.com/no_longer_exists/404.png; style="padding:18px;border:0px;"></td><td valign="top"> <table width='99%' cellpadding='0' cellspacing='0' align='center'><tr><td> <body bgcolor='#FFFFFF' leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink='#000000' vlink='#000000'> <div class="banner" width="100%"> </center> </div> <table width="100%" > <td class="customsubmenu" align='center' width="100%"> <a STYLE="text-decoration:none" href="http://z11.invisionfree.com/FreeLoads/index.php?"> <img src="http://forums.xisto.com/no_longer_exists/404.png; </a> <a STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=site'> <img src="http://forums.xisto.com/no_longer_exists/404.png STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=Help'> <img src="http://forums.xisto.com/no_longer_exists/404.png STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=Search&f='> <img src="http://forums.xisto.com/no_longer_exists/404.png; </a><a STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=Members'> <img src="http://forums.xisto.com/no_longer_exists/404.png; </a><a STYLE="text-decoration:none" href='http://z11.invisionfree.com/yourBOARDNAMEhere/index.php?act=calendar'> <img src="http://forums.xisto.com/no_longer_exists/404.png; </td> </table> <center><div> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload2.macromedia.com/pub/shockwave/cabs/flash/swflash.cab; width="210" height="25" id="mp3playerdarksmallv3" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="http://player.podbean.com/mp3playerdarksmallv3.swf?audioPath=http://podcasting.ie/tracks/moby/moby_extreme_ways.mp3&autoStart=no; /> <param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /><param name="wmode" value="transparent" />http://forums.xisto.com/no_longer_exists/ <embed src="http://player.podbean.com/mp3playerdarksmallv3.swf?audioPath=http://podcasting.ie/tracks/moby/moby_extreme_ways.mp3autoStart=no; quality="high" width="210" height="25" name="mp3playerdarksmallv3" align="middle" allowScriptAccess="sameDomain" wmode="transparent" type="application/x-shockwave-flash" pluginspage="https://get.adobe.com/flashplayer/otherversions/; /></embed> </object> </div> </td> </table> <% BOARD HEADER %> <script>//New PM Flasher - By Markup userLinks=document.getElementById('userlinks'); if(userLinks.innerHTML.match("Inbox")) { newMsg=false; a=userLinks.getElementsByTagName("A"); for(i=0;i<a.length;i++)if(a.innerHTML.match(/Inbox\s\([0-9]+\)/)&&a.innerHTML.match(/[0-9]+/)>0)newMsg=i; if(newMsg) { inbox=a[newMsg]; inbox.style.fontWeight="Bold"; inbox.style.color="red"; flash(); } } function flash() { if(inbox.style.visibility=="hidden")inbox.style.visibility="visible"; else inbox.style.visibility="hidden"; setTimeout("flash()",500) } </script> <script type='text/javascript'> <!-- // Change the Inbox text at the user links // code by ticlo // http://s4.invisionfree.com/Digitalized e = document.getElementById('userlinks') a = e.getElementsByTagName('A') for (i =0; i < a.length; i++) { if (a.href.indexOf('act=Msg&CODE=01') != -1) { s = a.innerHTML a.innerHTML = s.replace(/Inbox/, 'Inbox') break }} // --> </script> <% NAVIGATION %> <% BOARD %> <br/> <center><B>©</B> <a href="http://z11.invisionfree.com/FreeLoads/index.php?showuser=1; target="_blank"><B>miikerocks</a></b>-><b><a href="http://z11.invisionfree.com/FreeLoads/index.php; target="_blank">FreeLoads Forum</a></b><p> <text color=white>Part of style by inkdropstyles.com</text color></center> Now put this in footer: <script type='text/javascript'><!--// 3-part maintitled = document.getElementsByTagName('DIV')for (n = 0; n!=-1; n++) { if (d[n].className == 'maintitle' && d[n].parentNode.id != 'ucpmenu' && d[n].parentNode.id != 'ucpcontent') {c = d[n].innerHTMLd[n].innerHTML = "<div class='left'><div class='right'><div class='text'>" + c + "</div></div></div>"}// 3-part tableborderif (d[n].className == 'tableborder') {t = d[n].innerHTMLd[n].innerHTML = t + "<div class='left'><div class='right'> </div></div>" } }// --></script></td></tr></table></div><br/><script type="text/javascript">a = window.location.hrefif (a.match('showtopic=') || a.match ('ST=')){c = document.getElementsByTagName('td')for (d=0;d<c.length;d++){if (c[d].id == 'QUOTE'){c[d].parentNode.parentNode.getElementsByTagName('td')[0].className = 'quotetop'}else if (c[d].id == 'CODE'){c[d].parentNode.parentNode.getElementsByTagName('td')[0].className = 'codetop'}}}</script></td><td align="left" valign="top" background="http://img513.imageshack.us/img513/5678/rightimageborderil6.png" style="padding:18px;border:0px;"></td></tr></table></td></tr></table> FOOTER CODE 2 (doHTML added): <script type='text/javascript'><!--// 3-part maintitled = document.getElementsByTagName('DIV')for (n = 0; n!=-1; n++) { if (d[n].className == 'maintitle' && d[n].parentNode.id != 'ucpmenu' && d[n].parentNode.id != 'ucpcontent') {c = d[n].innerHTMLd[n].innerHTML = "<div class='left'><div class='right'><div class='text'>" + c + "</div></div></div>"}// 3-part tableborderif (d[n].className == 'tableborder') {t = d[n].innerHTMLd[n].innerHTML = t + "<div class='left'><div class='right'> </div></div>" } }// --></script></td></tr></table></div><br/><script type="text/javascript">a = window.location.hrefif (a.match('showtopic=') || a.match ('ST=')){c = document.getElementsByTagName('td')for (d=0;d<c.length;d++){if (c[d].id == 'QUOTE'){c[d].parentNode.parentNode.getElementsByTagName('td')[0].className = 'quotetop'}else if (c[d].id == 'CODE'){c[d].parentNode.parentNode.getElementsByTagName('td')[0].className = 'codetop'}}}</script></td><td align="left" valign="top" background="http://img513.imageshack.us/img513/5678/rightimageborderil6.png" style="padding:18px;border:0px;"></td></tr></table></td></tr></table><script type='text/javascript'>//miikerocksvar doHTML_open = 0;td = document.getElementsByTagName("td");for(x=0;x<td.length;x++){if(td[x].className=="pformright" && td[x].innerHTML.match(/Close all Tags/i)){ content = td[x].innerHTML; td[x].innerHTML = "<input type='button' value='doHTML' onclick='simpletag(\"doHTML\")' class='codebuttons' name='doHTML' style=\"font-weight:bold\" />" + content;}}</script> For those who don't know, Header and Body, AND Footer can be found in: Admin CP>>Skinning and Styles>>Board Wrappers.Also: The style sheets (or forum CSS) can be found in Admin CP>>Skinning and Styles>>Manage Style Sheets. For help, or if you have any questions, please pm me, or reply and I will help you with any problems you may have. (If you PM me I will likely get to it faster) ---END OF TUTORIAL--- THANKS FOR READING!! Share this post Link to post Share on other sites
