Author Topic: Helios Stylesheet Color Swapper (Read 3068 times)

taogem · « **on:** January 15, 2011, 08:49:22 am »

Forum Url: http://snuffbottle.smfforfree.com/
Although the Helios color red has not worked on my other forum for quite a while, I still copied and pasted the Helios code to my new forum.

I did not change anything during prior to the copy and paste, but it is really messed up.

Maybe someone could have a peek and click on the different color options at the top of forum ? See what ya think ? Or maybe something is messed up in the code ?

Code: [Select]


<!-- Helios Stylesheet Color Swapper -->

<table cellpadding="0" cellspacing="0" align="center">
<td align=center>
<style type="text/css">
fieldset { border: none !important; }
</style>
<form action="#" id="styleswitcher" class="styleswitcher"><small>
<input type="radio" name="style" value="red" onclick='changeStyle(this.value); parent.frames["top"].changeStyle(this.value)'>  <img src="http://i4.photobucket.com/albums/y138/connieaz/helios/redblock.png"> Helios Red
<input type="radio" name="style" value="green" onclick='changeStyle(this.value); parent.frames["top"].changeStyle(this.value)'> <img src="http://i4.photobucket.com/albums/y138/connieaz/helios/greenblock.png"> Helios Green
<input type="radio" name="style" value="blue" onclick='changeStyle(this.value); parent.frames["top"].changeStyle(this.value)'> <img src="http://i4.photobucket.com/albums/y138/connieaz/helios/blueblock.png"> Helios Blue
<input type="radio" name="style" value="purple" onclick='changeStyle(this.value); parent.frames["top"].changeStyle(this.value)'> <img src="http://i4.photobucket.com/albums/y138/connieaz/helios/purpleblock.png"> Helios Purple
</fieldset>
</form>
</small>
</td>
<tr>
<td  class=header height="56px" width="861px" align=center>
</td>
</tr>
</table>
 
<!-- The Stylesheet Links -->

<link rel="stylesheet" type="text/css" href="http://www.smfforfree4.com/styles/gemstone/heliosblue.css?fin11" title="blue">
<link rel="alternate stylesheet" type="text/css" href="http://www.smfforfree4.com/styles/gemstone/heliosred.css?fin11" title="red">
<link rel="alternate stylesheet" type="text/css" href="http://www.smfforfree4.com/styles/gemstone/heliosgreen.css?fin11" title="green">
<link rel="alternate stylesheet" type="text/css" href="http://www.smfforfree4.com/styles/gemstone/heliospurple.css?fin11" title="purple">

<!-- Script for Stylesheet Swapper DO NOT EDIT  -->
<script type='text/javascript'>
function changeStyle(title) {
var lnks = document.getElementsByTagName('link');
for (var i = lnks.length - 1; i >= 0; i--) {
if (lnks[i].getAttribute('rel').indexOf('style')> -1 && lnks[i].getAttribute('title')) {
lnks[i].disabled = true;
if (lnks[i].getAttribute('title') == title) lnks[i].disabled = false;
}}}

function switchit() {
if (readCookie('style')) { title=readCookie('style'); changeStyle(title); var radios = document.getElementById ('styleswitcher');
if (radios) {
 var inputs = radios.getElementsByTagName ('input');

 if (inputs) {
   for (var i = 0; i < inputs.length; ++i) {
     if (inputs[i].type == 'radio' && inputs[i].name == 'style')
       inputs[i].checked = inputs[i].value == (title)
   }
 }
} } } 


// function topchangeStyle(title) {
// var lnks = document.getElementsByTagName('link');
// for (var i = lnks.length - 1; i >= 0; i--) {
// if (lnks[i].getAttribute('rel').indexOf('style')> -1 && lnks[i].getAttribute('title')) {
// lnks[i].disabled = true;
// if (lnks[i].getAttribute('title') == title) lnks[i].disabled = false;
// }}}

function setActiveStyleSheet(title) {
  var i, a, main;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
      a.disabled = true;
      if(a.getAttribute("title") == title) a.disabled = false;
    }
  }
}

function getActiveStyleSheet() {
  var i, a;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
  }
  return null;
}

function getPreferredStyleSheet() {
  var i, a;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1
       && a.getAttribute("rel").indexOf("alt") == -1
       && a.getAttribute("title")
       ) return a.getAttribute("title");
  }
  return null;
}

function createCookie(name,value,days) {
  if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
  }
  else expires = "";
  document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  }
  return null;
}

window.onload = function(e) {
  var cookie = readCookie("style");
  var title = cookie ? cookie : getPreferredStyleSheet();
  setActiveStyleSheet(title);
}

window.onunload = function(e) {
  var title = getActiveStyleSheet();
  createCookie("style", title, 365);
}

var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);
</script>

simply sibyl · « **Reply #1 on:** January 15, 2011, 09:54:23 am »

Go back through the directions (from start to end) and double check - see if you missed any code that needs to go into the footer and the css. (Sorry, but its been a very long time since Ive looked at this)

One thing though - in your header code you have Helios Blue set as the default stylesheet. You have to do so in Admin > Manage styles as well or there will be some issues so check both forums to see if you do have the Blue one set as the default style.

The "red" style looks to me like you need to grab the css for the red one again and modify yours - its definitely messed up, seems to be using tabs from a space style and other images from other styles. I had updated ALL of the helios styles quite some time ago (and after you had installed the older ones) You are using the older versions of them and it might be good to update them all. I had also updated the code. You can find all of the styles, and the code and directions here: http://testforumserver4.smfforfree4.com

There is another way to go with swapping styles that works welll and doesnt mess up. I have it working on my test site:
http://sibylstestsite.smfforfree3.com/index.php It was simple to set up.

Directions for setting it up are here:
http://sibylstestsite.smfforfree3.com/index.php/topic,127.msg186.html#new

taogem · « **Reply #2 on:** January 15, 2011, 02:09:17 pm »

Forum Url: http://snuffbottle.smfforfree.com/
There are no styles to choose from at all in the drop down menu at admin/main. The drop down menu is blank with the exception of default.

The only Helios style that is displayed on that page under the "User Created Styles" is red.

I will check out those links here in a bit, and thanks for those.

Will likely be back with more questions later

Have a nice day Sibyl..

simply sibyl · « **Reply #3 on:** January 15, 2011, 02:20:23 pm »

Yeah when you signup for a new forum you will only see the Default style listed in the style picker. There are a few others you can install under Admin > Manage Styles. You can click on the thumbnails to install them.

BUT -
The Helios Red Style that is listed there is NOT the updated one (its the older version) so it would be best to grab it from the site I posted as it will match the others. To get the other Helious colors onto your forum you need to add them by creating a new style for each one, modifying that style and pasting in the css. The directions are listed on the link with each of the stylesheets. (at the link I gave you) If you decide to update them on your gem forum you can just modify the ones you already have installed and replace the existing css with the new css - and follow the directions for the header/footer code.

If you dont remember how to create/modify stylesheets this will help:
Admin CP Manage Styles Guide

Tip: You are going to need to refresh your browser after modifying any stylesheet. Also because the swapper(s) use scripts and all of the changing you will be doing it would be smart to also clear the cache in your browser, then refresh it once you get it all installed.

I'll check back here and there adn see how you are getting along. Gotta warn you though: football playoff day today and tomorrow and Im gonna be on the couch watching the games so I may be slow getting back to you.

Subject / Started by	Replies	Last post
[Code] Stylesheet Swapper Started by simply sibyl « 1 2 ... 7 8 » SMF For Free Codes and Support	107 Replies 28809 Views	May 05, 2010, 03:50:24 pm by Bolens
Helios Stylesheet Color Swapper (Updated 8/27/08) Started by simply sibyl SMF For Free Codes and Support	9 Replies 5517 Views	August 27, 2008, 11:44:58 am by simply sibyl
Helios Stylesheet Color Swapper Question Started by taogem SMF For Free Codes and Support	3 Replies 1650 Views	May 07, 2008, 12:21:36 am by simply sibyl
Stylesheet swapper not working Started by marajade312 Stylesheet Requests and Support	2 Replies 1709 Views	October 02, 2009, 10:16:51 am by marajade312

SMF For Free Support Forum

News:

Author Topic: Helios Stylesheet Color Swapper (Read 3068 times)

taogem

Helios Stylesheet Color Swapper

simply sibyl

Re: Helios Stylesheet Color Swapper

taogem

Re: Helios Stylesheet Color Swapper

simply sibyl

Re: Helios Stylesheet Color Swapper

Related Topics