Help - Search - Members - Calendar
Full Version: More than one way to skin a cat('s website)
Movable Type Community Forum > Additional Resources > Tips and Tricks
JVerber
I know there are other tutorials out there for skinning your site, but I recently finished up an article explaining how I skinned Feeny's Funhouse, my cat's (and my) website (largely powered by MT). My method doesn't involve server-side includes, so you can keep your file extensions, and is based on CSS and PHP or ASP.

If you're interested, you can find the article here.
medic119
I love the way people come up with new and inventive ways to do things.

Interesting method.  First time I've seen ASP used.
JVerber
I first made the whole thing with ASP because I know that better than PHP. But once I had it up and running, I decided that maybe PHP would be better (which it is) and more consistent with the rest of my site (only one or two more ASP pages left) so I switched it over. It was a good learning experience.

In case anyone's interested, I just added a tutorial on CSS rollovers (mouseovers, whatever) that goes really well with my method of skinning. And it gets around bugs in Opera!  smile.gif
shanni
I want to learn to skin my site (I only need to change the stylesheets) but I couldn't get this method to work.   sad.gif
bmk
A great article: Build a PHP Switcher

Here I wrote how you can apply this using MT.
bmk
There's this javascript method too:Alternative Style

edited to add:  OMG! JVerber, those kitty cats to click for your comments are so cu-ute!
shanni
Well I sort of got it working using the tutorial from a list apart.

Here is what I've got so far.  The comments don't come up in the little pop up box though and when I switch styles sometimes I get a funky block of the last skin's color until I scroll, then it goes away.  I honestly have no idea what I'm doing.   tongue.gif
shanni
bmk - I'm going to go try out a second test blog using your tutorial.  I LOVE tutorials with screenshots to help!  I'm such a visual leaner.  

Edited:  Yay!  :)  I got that to work very nicely.  Thanks so much for making such a clear, easy to understand tutorial!
Here is my test page so far.
bmk
I really like your designs, particularly the snow tree one.  Looks great, good job!  :)
shanni
Thanks!  Ok I set everything up on my main site now and added some more layouts.  I'm so excited - it's working great EXCEPT the comments are not changing.  I put this code in the comments templates:
CODE
<link rel="stylesheet" href="<$MTBlogURL$>style<?php echo
(!$sitestyle)?'1':$sitestyle ?>.css" type="text/css" />

but the stylesheets are not showing up in the comments! Help!  How do I fix this?
scherre
your comments are loading through mt-comments.cgi. that means that the file is not being parsed for php as the entry and main page are.
kadyellebee
Or, in other words, the normal comment popup cannot be skinned as easily because PHP isn't allowed inside of CGI pages.
What some people do who want their popups skinned is format the Individual Archive page with the php includes, and then use some javascript to make that page popup instead of the comments popup.
Or, you could just pick a pretty stylesheet out of the skins and use that one with just a normal stylesheet tag in the head instead of the PHP.  It would be the same no matter which skin the user picked to see, but still would let you use the comment popup as is smile.gif

Kristine
tekgirl
Can anyone help me with this? I have tried the tutorial
here, here, and here.

The concept makes sense to me and I think I am on the right track. At least, the skin folder seems to kinda work.

You can see it here.

But my test index just is totally wonked out... see.



This is the code I am using for the test part:

CODE
<?php
include('/home/tekwh0re/public_html/SCRIPTS/cookiecheck.php');
?>

<?
$headervar = "/home/tekwh0re.net/public_html/skins/header";
$footervar = "/home/tekwh0re.net/public_html/skins/footer";
$extension = '.php';
include('$headervar.$skin.$extension);
?>



<MTEntries>

<$MTEntryTrackbackData$>

    <MTDateHeader>
    <h2 class="date">
    <$MTEntryDate format="%x"$>
    </h2>
    </MTDateHeader>

    <div class="blogbody">
    
    <a name="<$MTEntryID pad="1"$>"></a>
    <h3 class="title"><$MTEntryTitle$></h3>
    
  <$MTEntryBody$> <MTEntryIfExtended> <span class="extended"><a href="<$MTEntryPermalink$>#more">"there's
     still more..." she said"<$MTEntryTitle$>"</a></span><br />
    </MTEntryIfExtended>
    
  <div class="posted">Posted by <$MTEntryAuthor$> at <a href="<$MTEntryPermalink$>"><$MTEntryDate
       format="%X"$></a> <MTEntryIfAllowComments> | <a href="<$MTCGIPath$><$MTCommentScript$>?entry_id=<$MTEntryID$>" onclick="OpenComments(this.href); return false">entertain
       me (<$MTEntryCommentCount$>)</a> </MTEntryIfAllowComments> <MTEntryIfAllowPings>
       | <a href="<$MTCGIPath$><$MTTrackbackScript$>?__mode=view&entry_id=<$MTEntryID$>" onclick="OpenTrackback(this.href); return false">TrackBack
       (<$MTEntryTrackbackCount$>)</a> </MTEntryIfAllowPings> </div>

</div>

</MTEntries>
<$MTInclude module="footer"$>



I have been working on this all day and it's so important that I figure out why this is all wrong. I need to get my poll script to work at the same time as this... but one thing at a time for the moment.

Anyone who is kind enough to help will get my heartfelt thanks.

Tek
tekgirl
How about heartfelt thanks and a CD or book off your wishlist? (under $15)

BUT.. you also have to explain to me what I did wrong so that I can learn.

Will that sweeten it?
kayseebay
That sort of error usually means the file isn't there. Or that the permissions aren't correct. Did you check those?

Ruthie
kadyellebee
The link you have for my love-productions tutorial (a companion for Amy's domesticat site) is actually the non-skinned version of the tutorial -- check out this one and see if it helps you at all. smile.gif

It looks like the fun.php page is trying to look for the header/footer in the /home/tekwh0re/public_html/pain/skins/ directory. Is it possible that it should be looking in /home/tekwh0re/public_html/skins/ ?? Is that because you are using a test blog that isn't in the same directory as your main blog?

And the skins index looks like it might not be generated inside of MT -- is it an Index Template inside of MT?

Post back and let us know how its going! smile.gif

Kristine
tekgirl
I mis-linked... I ment to link to the tutorial on skinning on love productions... Me stupido!

Anyway, actually, I need to clean up the directories. I was basing on the tutorial on scriptygoddess as that I want to keep my skins files out of my moveable type install.

The reason why you see another skins directroy is sometime yesterday, I decieded to try to get it to work by following the tutorial on loveproductions to a T. Well in my case, it seems I was closer to getting it to work when I was doing it the way I found on scripty goddess.
I would rather keep the skin files outside of MT as that is easier for me to manage and I like to leave the movabletype directory alone if I can.

In order perhaps make things seem more clear, let me post my directrory structure so you can see how the files look:


CODE
public_html
        movabletype- (the "live blog")
        pain -(the test blog)
               fun.php- our test "index.php" for blog
        SCRIPTS- (cookies and some java scripts)
                    cookiecheck.php
        skins -
                    header1.php, footer1.php, index.php,
index2.php
                     skin1
                     skin
         *etc... not related
         *etc... not related


so... What is the ORGINIAL code before the sandwhich making?

HERE


I uploaded the files to my server in sort of the way the diretories look HERE.


Once we put it all together and try to go to "fun.php", we get this:

CODE
Parse error: parse error in /home/tekwh0re/public_html/pain/fun.php on line 28


Now why I can't understand this is because if you here which is the index.php page in the skins directory, it seems like something is working...

I've cut, repasted... tried it one way... tried it another... and it just cannot sort out what I did wrong.

I want to do this because I get older readers on my site who don't like gold on grey layout that I use as default. I changed to black on white, and now the younger ones don't like that. Personally I like the darker one but I want to accomidate everyone if I can.


Sorry to be such a pest. I just hate it when I cannot get something to work and I am really trying. I know it must work... I' just cannot figure out why I can't get it to work.

Thanks for listening. smile.gif
kadyellebee
You said:
QUOTE
I would rather keep the skin files outside of MT as that is easier for me to manage and I like to leave the movabletype directory alone if I can.


Okay, so if you don't want to set up the templates for headers and footers inside of MT in the template screen, then they can't have any MT tags in them. The only way that these tags get processed is when they are built inside of MT. For example, in header1., you'll see that the MT tags that are in there are all ones that can be replaced with the actual text you are using -- MTBlogName with the actual blog name, and so on. These things aren't too likely to change, so replacing them with the text isn't too big of a deal for most people.

And then in footer1, you may want to create a New Index Template for your recent comments, entries, and archives. That whole section can be put into a template, and then included that file into the footer with a php include.

The best way to determine what the error on line 28 is -- use your ftp client to download fun.php and open it in a text editor with line numbering. This will let you see what 28 really is after MT processes it, and hopefully that will help you/us determine what's going on. smile.gif

Okay, hopefuly these tips will help get you going smile.gif

Kristine
tekgirl
I did take it out in a text editor and if I recall the line was:
CODE
<h3 class="title"><$MTEntryTitle$></h3>

then it parsed error on another line.

sad.gif

I tried, but I don't think I can do it, I guess.

Thank you for all of your help and time. I feel bad about bothering you. sad.gif
kadyellebee
And fun.php is set up as the index template in the Pain blog? The MT tags should be changed into the actual data if you viewed it after downloading from your FTP client. So if it really showed MTEntryTitle in there as the line that gave the parse error, that's odd.
Its true that if I look at the fun.txt file you uploaded, line 28 has MT tags in it, but the line numbers may be different after MT processes the file.

I wonder...
CODE
include('$headervar.$skin.$extension);

that line doesn't have a closing quotation mark in there. Maybe that's causing problems?

I think that you are so close to getting this, so I feel bad that I'm not pointing you in the right direction to just magically have it work!!!

Kristine
tekgirl
*smiles*

I feel like I was close as well.

I'll see about the closing quotation. I'll make an edit.

fun.php is a test file. if things work, it should look like this page.

They are in the same directory. It would almost be as if I have two index pages in the same directory.. just one is called index.php and the other is fun.php. Fun.php obviously is the one that has all the php header, footer, etc that we are trying to get to work however. =)
tekgirl
*screams*

OMG... well.. something better DID happen!!!

look!

That was after I added the " ' " that seemed to be missing!

Now it says it can't find the header and footer files...

but they are in there... so that is a little strange.
kadyellebee
Okay, well fun.php isn't getting the line 28 error anymore, that's a good sign. smile.gif
kadyellebee
Woo! smile.gif

So what does this section of the code in fun.php look like now:
CODE
<?
$headervar = "/home/tekwh0re/public_html/skins/header";
$footervar = "/home/tekwh0re/public_html/skins/footer";
$extension = '.php';
include('$headervar.$skin.$extension);
?>

Its like its not trying to replace the variables (with dollar signs) with their correct info, so I'm thinking there's something in there that's different than just the quote that you changed. smile.gif
tekgirl
CODE
<?php
include('/home/tekwh0re/public_html/SCRIPTS/cookiecheck.php');
?>

<?
$headervar = "/home/tekwh0re/public_html/skins/header";
$footervar = "/home/tekwh0re/public_html/skins/footer";
$extension = '.php';
include('$headervar.$skin.$extension');
?>



The entire of "fun.php"
CODE
<?php
include('/home/tekwh0re/public_html/SCRIPTS/cookiecheck.php');
?>

<?
$headervar = "/home/tekwh0re/public_html/skins/header";
$footervar = "/home/tekwh0re/public_html/skins/footer";
$extension = '.php';
include('$headervar.$skin.$extension');
?>




<MTEntries>

<$MTEntryTrackbackData$>

    <MTDateHeader>
    <h2 class="date">
    <$MTEntryDate format="%x"$>
    </h2>
    </MTDateHeader>

    <div class="blogbody">
    
    <a name="<$MTEntryID pad="1"$>"></a>
    <h3 class="title"><$MTEntryTitle$></h3>
    
  <$MTEntryBody$> <MTEntryIfExtended> <span class="extended"><a href="<$MTEntryPermalink$>#more">"there's
     still more..." she said"<$MTEntryTitle$>"</a></span><br />
    </MTEntryIfExtended>
    
  <div class="posted">Posted by <$MTEntryAuthor$> at <a href="<$MTEntryPermalink$>"><$MTEntryDate
       format="%X"$></a> <MTEntryIfAllowComments> | <a href="<$MTCGIPath$><$MTCommentScript$>?entry_id=<$MTEntryID$>" onclick="OpenComments(this.href); return false">entertain
       me (<$MTEntryCommentCount$>)</a> </MTEntryIfAllowComments> <MTEntryIfAllowPings>
       | <a href="<$MTCGIPath$><$MTTrackbackScript$>?__mode=view&entry_id=<$MTEntryID$>" onclick="OpenTrackback(this.href); return false">TrackBack
       (<$MTEntryTrackbackCount$>)</a> </MTEntryIfAllowPings> </div>
    
    </div>
    


</MTEntries>

<? include('$footervar.$skin.$extension'); ?>

</body>
</html>



I am throwing in "cookiecheck.php"

CODE
<?

$total_skins = 14;
$default_skin = 1;

 if (isset($_REQUEST['newskin'])) {
   $newskin=(int)$_REQUEST['newskin'];
   if ( ($newskin<1) OR ($newskin>$total_skins) ) $newskin=$default_skin;
 } elseif (isset($_REQUEST['skin'])) {
   $newskin=(int)$skin;
   if ( ($skin<1) OR ($skin>$total_skins) ) $newskin=$default_skin;
 } else $newskin=$default_skin;

 $skin=$newskin;
 setcookie ('skin', "", time() - 3600);
 setcookie('skin',$newskin,time()+(86400*365),'/');
 setcookie('skin',$newskin,time()+(86400*365),'/','.tekwh0re.net, veritas-parit.net');
 $skin=$newskin;


   $headervar = "/home/tekwh0re/public_html/skins/header";
   $footervar = "/home/tekwh0re/public_html/skins/footer";
   $extension = ".php";
?>


The errors that it is now coming up with are pretty odd.

For one thing.. when I open up fun.php I have no line 419


*close enough to smell the water... still dying for a drink! tongue.gif *
kadyellebee
Another idea to try -- try taking out the quotation marks of the include statement. That may be making it assume those words are meant to be printed rather than variables.

CODE
include($headervar.$skin.$extension);

see the code here in the header module

Same for the footer.

From the error messages you are getting now, I'm guessing that line 412 (current message) is the line that the include statement is on. Hopefully this change to get rid of the quotation marks will fix that.

Kristine smile.gif
tekgirl
Yes... much, much closer...

But not quite. At least now the test blogis showing up and some of the formatting.

It seems as if the cookies are not staying, however.

I almost sees as if you MUST put this in wiht the mt install.
tekgirl
Okay... it seems like things are okay save for the fact that some of the MT tags still are not comming out correctly.

BTW... I did make a change and put that skins directory into the pain directory and changed the mappings to now point to skins in the pain directory.

I still think that one insy, tinsy thing is wrong.

But what?
kadyellebee
Ahh, I can actually switch skins now when I go to the skins index. smile.gif

Did the thoughts I wrote in my Dec 21 2003, 04:54 PM reply help as far as the MT tags in your header and footer? I'm pretty sure that the reasons I wrote above would cause what you are seeing now.

The cookie is being set for both tekwh0re.net and www.tekwh0re.net in my browser, so that's a good sign. smile.gif

Kristine
tekgirl
Okay...

totally lost.

I've tried rearranging files and now it's skinning with the right colors and html...

the blog is showing up.

But the other little things are not!

Like the blog title
the archives
last comments..

etc...

See.

http://www.tekwh0re.net/pain/fun.php
tekgirl
QUOTE (kadyellebee @ Dec 22 2003, 08:43 PM)
Ahh, I can actually switch skins now when I go to the skins index. smile.gif

Did the thoughts I wrote in my Dec 21 2003, 04:54 PM reply help as far as the MT tags in your header and footer?  I'm pretty sure that the reasons I wrote above would cause what you are seeing now.

The cookie is being set for both tekwh0re.net and www.tekwh0re.net in my browser, so that's a good sign. smile.gif 

Kristine

yeah... your thoughts helped in that:

1. the code was a bit off with the quotation mark being in there. That seemed to solve the problem of getting the html and css to show up.


2. The tags for the MT elements in header and footer just won't show, no matter what I do. I am at a loss. I think I have tried mapping to and moving files to every directory I can think of.

It just makes no sense to me because when it's one page, it all works...

When we do the sandwhich thing- the bottom is obvioulsy working as that the layout is correct. The top is working because the css is correct. The middle is correct... we can see the blog entries..

But we can't get any other MT element in the header and footer up and it boggles me to sort out why.

I have to admit something... I can hack bits of code together... but I am a network administrator... any webstuff is self taught. This is why I might miss something that seems obvious.
kadyellebee
Your "bread" in the sandwich is definately there, its just not getting toasted. smile.gif Any MT tags need to be "toasted" to fill in the values. smile.gif

There are two ways to "make toast". Any MT tag used in your templates needs to be generated INSIDE of MT. Here's two ways to do it. The 2nd is how I do it, but the 1st is probably easier.
  • Create a New Index Template and paste the contents of header1.php in it. Call it Header 1 with it publishing to skins/header1.php. Repeat with a second Index Template for footer1.php.
    When you add header2.php and footer2.php, create a set of templates for each one. Repeat for 3 and 4 and so on.
  • Create Index Templates for your data in the footer and include THAT into your page. Replace the MT tags in your header with actual values, like your actual Blog Name, Description, and so on.
    Here's how I would break up your footer1 file:
    create a New Index Template named Recent publishing to recently.php. Use this as the template text:
    CODE
    <div class="sidetitle">
    Last comments
    </div>
    <div class="side">

          ...all the way down to...

    Powered by<br /><a href="http://www.movabletype.org">Movable Type <$MTVersion$></a><br /> </div>

    Then in the footer.php, you'd replace the aforemented code with
    CODE
    <? include('/home/tekwh0re/public_html/pain/recent.php'); ?>

Is that a bit more clear?huh.gif??

Kristine
tekgirl
*screams, does the 'shakey-happy-boogie-woogie*

THANK YOU!!!

THANK YOU!!!


THANK YOU!!!!

Please check your email!!!

Kadyellebee...

YOU ROCK!
biggrin.gif
kadyellebee
Woooooo!!!!!
I am so glad to hear that its working!! smile.gif I got your email, and I'll go reply now. smile.gif

Kristine
tekgirl
Okay... maybe I spoke too soon.

I changed everything now to the main website.

My Webpage

And the skins seem to work at first.. but then yif you switch to a new skin, it takes you back to the orginal skin.

I'm a bit at a loss again. It's like the cookie is "forgetting".

Any suggestions?
gdapper
hi... i'm having the same problem. i can see the new skin when i go to index2.php?newskin=2, but when i click to go back to the index page, the cookie doesn't seem to stick.

i set up a test site: thor's blog

testing skining page

cookiecheck.php

CODE
<?
if (isset($newskin)) {
$newskin=(int)$newskin;
if ($newskin<1) $newskin=1;
if ($newskin>10) $newskin=1;
} elseif (isset($skin)) {
$newskin=(int)$skin;
if ($skin<1) $newskin=1;
if ($skin>10) $newskin=1;
} else {
$newskin=1;
}
$skin=$newskin;


$headervar = "/usr/home/gsd/www/htdocs/thor/skins/header";
$footervar = "/usr/home/gsd/www/htdocs/thor/skins/footer";
$extension = ".php";
?>


skins/index.php:
CODE
<?php include('/usr/home/gsd/www/htdocs/thor/skins/cookiecheck.php'); ?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<? include($headervar.$skin.$extension); ?>

<div class="bighead">Pick a Skin</div>

<br>
join <a href="http://www.ringsurf.com/netring?ring=skinned;action=home" target="_top" onmouseover="window.status='the skinned! ring homepage'; return true" onmouseout="window.status=''; return true">skinned!</a>
<br>

<b>Skin 1</b><br><a href="<$MTBlogURL$>skins/index2.php?newskin=1">Make this one my skin.</a><br><br>

<b>Skin 2</b><br><a href="<$MTBlogURL$>skins/index2.php?newskin=2">Make this one my skin.</a><br><br>

<b>Skin 3</b><br><a href="<$MTBlogURL$>skins/index2.php?newskin=3">Make this one my skin.</a><br><br>

<div align="center" class="blogfoot">The setup of skins for <$MTBlogName$> was made possible by a tutorial by <a href="http://www.domesticat.net/" target="_blank">Domesticat</a> with MT help by <a href="http://love-productions.com" target="_blank">love-productions</a>.  </div>

<? include($footervar.$skin.$extension); ?>

</body>
</html>


i would really appreciate any help anyone has time to give. i'm utterly frustrated.

thanks!
kadyellebee
The cookie is being set in the browser correctly, but the pages don't seem to be changing. With the exception of skins/index2.php -- that is the only place I see a difference depending on which skin I select.

I'm seeing several MT tags that aren't processed -- did you set up the tutorial from love-productions with header and footer modules inside of MT? Your cookiecheck.php file might not be getting included. It doesn't seem to know what to do with the $newskin variable even when I manually force it by typing http://www.daisydo.com/thor/?newskin=2 -- that should show me the second skin as the design, but on the index pages, its not doing that. So yeah, check on that; I'm pretty sure its got to do with the cookiecheck file.

Kristine
gdapper
i followed the instructions at love-productions.com... and copied everything verbatum. i even downloaded some templates thinking that would help.

i made some modifications to index2.php changing the love-productions code at the beginning to (found at domesticat.net):

CODE
<?php

$total_skins = 3;
$default_skin = 1;

 if (isset($_REQUEST['newskin'])) {
   $newskin=(int)$_REQUEST['newskin'];
   if ( ($newskin<1) OR ($newskin>$total_skins) ) $newskin=$default_skin;
 } elseif (isset($_REQUEST['skin'])) {
   $newskin=(int)$skin;
   if ( ($skin<1) OR ($skin>$total_skins) ) $newskin=$default_skin;
 } else $newskin=$default_skin;

 $skin=$newskin;
 setcookie ('skin', "", time() - 3600);
 setcookie('skin',$newskin,time()+(86400*365),'/');
 setcookie('skin',$newskin,time()+(86400*365),'/','.daisydo.com');
 $skin=$newskin;

?>


which made the index2.php show the skin change, but making the same (or simular) change to the cookiecheck.php file does nothing.

i've even deleted everything and started from scratch in a different folder...

i'm sure the problem is in cookiecheck.php as well, but i just can't find it.

i can force the change of the default skin for the site, but following the link is just not working...

do you have any hints? i'm just not a php person.
gdapper
i just wanted to add that the problem has been fixed.

my php.ini file had register_globals in the off position. with a simple change to this file, everything is working.

thanks for your help! biggrin.gif
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2009 Invision Power Services, Inc.