Problem with my first Skin

[Yojance]

Hi, I'm having some trouble integrating subdreamer into a design. Everything is fine so far except for the plugins thing.

Could anyone care to explain well how this works? I can get them to show in but I want to know more. Here is my example:


<?php

$inputsize = 20;

for($i = 0; $i < 5; $i++)
{
if($pluginpath[$i] != 'plugins/p1_empty/empty.php')
{

if(strlen($pluginname[$i]) > 0)
{
echo '<h3>' . $pluginname[$i] . '</h3>';
}
echo '<p>'. include($pluginpath[$i]) .'</p>';
}
}



What does the $inputsize does there? I have it set at 20 but I have no idea what it does. Is it used to wrap the title of the plugin when it reaches 20?

Also, the for loop, i have it so as long as the plug in is less than 5, show it on the left side, now how do I go about showing the reset of the plugins (let say the content in the middle) show. I want to show about 5 more on the center, here is what I got.

<?php

$inputsize = 20;

for($i = 0; $i >= 6; $i++)
{
if($pluginpath[$i] != 'plugins/p1_empty/empty.php')
{

if(strlen($pluginname[$i]) > 0)
{
echo '<h2>' . $pluginname[$i] . '</h2>';
}

echo '<p>'. include($pluginpath[$i]) .'</p>';

}
}


Here is my testing URL
http://www.visualcs.com

Any help on this would be appreciate it.

Thanks for reading.

[Yojance]

NVM, I have figured out what was wrong with those loops. I just needed to get closer to the monitor. I just have to figure out whats wrong with the logo now.

[jessenco]

Hi, I'm having some trouble integrating subdreamer into a design. Everything is fine so far except for the plugins thing.
Could anyone care to explain well how this works? I can get them to show in but I want to know more. Here is my example:

You'll see that's quite simple.

First, in your skin install.php file you would have to set things up. It’s a good place to start.

$skinname = 'whatever_name_you_want';

// this is the least important setting and you can’t mess things up there.
// usually people chose mysterious name then have it tattooed on their chest.
// it's a kind of ritual for the first one.

$numdesigns = 3;

// this is the total numbers of design you will make.
// 3 is good for a newbie skins design project
// can be :
- One 2 columns design,
- One 3 columns design,
- And one 3 columns / 2 rows design...

For a total of: $numdesigns = 3;

(You get the idea)

$previewimage = 'whatever/images/preview.jpg';

// Is the folder where you’ll store the (big) preview image that show up in the skins admin panel

$authorname = 'probably your name';

Cannot be changed even if your design sucks!

$authorlink = 220;

// I don’t know.
// Ask one to the moderator (I didn’t though)

$designpath[] = 'whatever/whatever.php';

// where are your skin designs
// if you have this: $numdesigns = 3; above then you'll end-up with 3 of these in your install.php file:

$designpath[] = 'whatever/whatever_1.php';
$imagepath[] = 'whatever/images/whatever_1.jpg';

$designpath[] = 'whatever/whatever_2.php';
$imagepath[] = 'whatever/images/whatever_2.jpg';

$designpath[] = 'whatever/whatever_3.php';
$imagepath[] = 'whatever/images/whatever_3.jpg';

Plus in each of them you will have to set how many plugins they will have (hint; always put more so you can add some more plugins later)

You do that with this:

$maxplugins[] = 15;

So for example your install.php file could look like this:

// skin 1 w/12 plugins
$designpath[] = 'whatever/whatever_1.php';
$maxplugins[] = 12;
$imagepath[] = 'whatever/images/whatever_1.jpg';

// skin 2 w/18 plugins
$designpath[] = 'whatever/whatever_2.php';
$maxplugins[] = 18;
$imagepath[] = 'whatever/images/whatever_2.jpg';

// skin 3 w/3 plugins
$designpath[] = 'whatever/whatever_3.php';
$maxplugins[] = 3;
$imagepath[] = 'whatever/images/whatever_3.jpg';

input $inputsize = 20;

// This means the same as this in “old” HTML era:

<input name="textfield" type="text" size="20" />

In other words any plugins having an [input text] form object in it, char width html properties will be se to; size="20"

This is where people usually enter their name, email, etc…

Like Login panel, Newsletters plugins, etc...

Now in the next steps you will have to organize the number of plugins in your designs taking to account what you have set in your skins install.php file.

Since the above/first design: /whatever_1.php is a 2 columns skin and hold 12 plugins, then:

Left column could be like this:

for($i = 0; $i < 8; $i++) //…..and the rest of code

and right column like this:

for($i = 8; $i < 12; $i++) //…..and the rest of code

Or whatever number of plugins you want in each column as long you have 12 in your skin.

You would have to make the same thing with the next skin file. Which is:

$designpath[] = 'whatever/whatever_2.php';
$maxplugins[] = 18;

In which you would organize your plugins as your fancy skin is suppose to look like.

If you make a 1 column skin it could look like this: for($i = 0; $i < 18; $i++) //…..and the rest of code
Or if you make a 3 columns, 2 row skin it could look like this:

Left column: for($i = 0; $i < 5; $i++) //…..and the rest of code
Center column: for($i = 5; $i < 10; $i++) //…..and the rest of code

Right column: for($i = 10; $i < 13; $i++) //…..and the rest of code

Top row: for($i = 13; $i < 16; $i++) //…..and the rest of code

Bottom row: for($i = 16; $i < 18; $i++) //…..and the rest of code


Then you would have to do the same with the remaining skin. Which is:

$designpath[] = 'whatever/whatever_3.php';
$maxplugins[] = 3;
$imagepath[] = 'whatever/images/whatever_3.jpg';

Is that easy!
Now you never have to pay for skins anymore.
You can build beautiful skins in minutes with minimal resource.

Try to use nice and clean design.
Avoid nested tables.
Use DIV and CSS designs.
Use online XHTML validator to check your skin.
http://validator.w3.org/

Hope this help.
:D

[72dpi]

Great Input Jessenco, thanks for your input,
i know this is going to help many a person =)

[Yojance]

Thank you for that quick good tutorial. This is what should be posted on the Subdreamer site. Their tutorials and documentation are very poor at the moment. I was still able to make someting from their tutorials, but yours would have helped me make the layout work 100 times faster.

I'm having a problem with my skin, if you click on a news link, when it takes you to that page, the CSS file doesn't seem to be working and the layout looks like plain text.

Take a look at this link for more details:
http://www.visualcs.com/creative_studio/p2_articleid/6

If you can help, i would appreciate it.
Thanks again for this amazing tutorial.

[jessenco]

I'm having a problem with my skin, if you click on a news link, when it takes you to that page, the CSS file doesn't seem to be working and the layout looks like plain text.

Take a look at this link for more details:
http://www.visualcs.com/creative_studio/p2_articleid/6

If you can help, i would appreciate it.
Thanks again for this amazing tutorial.

Definitively your CSS file is not loaded.

CHMOD your CSS file to 0755 since there is nothing wrong in your source code and the file definitively exist in your skins folder.

and see what happen.

[Yojance]

I did what you said and didn't work, then looked at the code and realize that the path to the css file works only if you are in the front page.
I changed the url to the css to the full path and now it works.

I feel stupid but I'm glad I found out what was wrong.

Thanks for your help again.

[danielizzat]

$authorlink = 220;

// I don’t know.
// Ask one to the moderator (I didn’t though)

I only started using SD a few hours ago so I may be wrong, but I think this number refers to your user id on the official SD forums.

Any skin with the $authorlink set to 220 is made by Maximilian Bartel (http://www.subdreamer.com/forum/member.php?action=getinfo&userid=220) of indiqo.media .

Feather and Ultra Pill is by chaos (http://www.subdreamer.com/forum/member.php?action=getinfo&userid=36), so he/she/it has set this value to 36.

I have set mine to 34152, though I don't plan on making mine public as my profile number on the official SD forums is 34152.

[Yojance]

Yes, I put that on my skin too. I'm member 33898.
Thanks for the tip too, it can help others.

[valdet]

Hi Jessenco,

That's a great headstart for creating your very own skins.
Any chance someone like you can make a tutorial or some type of a manual (with screenshots) on how to create our own SD skins, from any free CSS skins??

Regards,

Val.

[jessenco]

Any chance for a tutorial or some type of a manual (with screenshots) on how to create our own SD skins, from any free CSS skins??

Yes there is chances. :) But before:
1- I'm moving my website on another server. :mellow:
2- I'll get back on Stanz issue with Cyrillic characters. :confused:
3- I'll do one step by step skinning tutorial with screenshot. ;)

[shanejeffery86]

Alright, time to add something to this topic.

With each skin design, you have a number of files:

Design Files (Design_1.php, Design_2.php, etc.)
categories.php
forummenu.php
forumskin.php
install.php
menu.css
style.cssI am aware that Jessenco addressed the issues dealing with the php code involving the install.php and design files. However, I am still confused as hell as to what needs to be done with the categories, forummenu, and forumskin files. I have been looking through different skins and each of them have different code in each of these files. Jessenco, any chance you can break down what is going on in these three files and what we need to pay attention to when creating a style.

I am aware of what all of the other files are for but those three files.

Thanks in advance for everything.

[valdet]

Yes there is chances. :) But before:

3- I'll do one step by step skinning tutorial with screenshot. ;)

Hello Jessenco,
Thanks for providing some awesome solutions here lately,

I hope you don't mind me asking, if you had some time to provide us with a simpler tutorial on how to create our own skins from existing css/html templates? Sorry to bring this old topic back, but I am just stuck on skinning. :)

Thanks,

Val.

[jessenco]

I'm working on something for you.

[valdet]

I'm working on something for you.

Thanks so much, I have some awesome HTML/CSS templates all set up and ready to hear your instructions :)

Cheers,

Val ;)

[TullyMan]

nice work jessenco

(correct me if im wrong) not sure if you noticed or not but all your for loops wont work. setting $i = 0 then checking if $i is greater than or equal to 18 isnt gonna echo anything in the for loop.

for($i = 0; $i >= 5; $i++)

should really be <= not >=

for($i = 0; $i <= 5; $i++)

but! otherwise a good helper for beginners

[jessenco]

(correct me if im wrong)

Not only you are absolutely right, but I even doubt I have placed this code myself. :eek:
Using it, I would have figured there is something wrong.
And, I never place equal sign in my skins. :confused:

Kinda weird.

:rolleyes: …must a bug in vbulletin.

Corrected anyway.
Thank you.

[TullyMan]

not a problem, i hardly use equals signs either.

agreed, defenitely a bug.