Recent Topics

1 Sep 13, 2009 06:55    

My b2evolution Version: Not Entered

Well I took the advice of a poster here to upgrade the blog I am working on and I got it to work on 3.0. I am trying to create a custom skin for it now like I had with the previous version and I cannot find a decent guide to walk me through the process of melding the blog to fit into the site I am working on.

I could really use some help with this, I've searched here and google to try to find a decent guide on creating a custom skin and integrating it into a web site layout.

2 Sep 13, 2009 10:44

Hi,

Try the following links below. :)

------------------
This first: http://manual.b2evolution.net/Website_integration

Others:
http://manual.b2evolution.net/Working_with_skins
http://manual.b2evolution.net/Skins_2.0
http://manual.b2evolution.net/TemplateTags
http://manual.b2evolution.net/Customization

More here: http://manual.b2evolution.net/Category:Skins
------------------

Then for some tips, here's how I first studied b2evo's skinning system.

- I kept the "Custom" skin for reference only. It has the different stuff usable for b2evo's Skin system.
- I copied an existing skin, renamed it to someone else, and used it as my based-skin. Since you are using b2evo v3, get a b2evo v3 Skin (like the four I ported, or the evo*==!#DEL#!==evo skins).
- Then first thing first, I read (do not scan) the skin code, your objectives:

1) Get a clear view of the relationship of each skin files
2) Re-create the "HTML" source code from your head (just by looking at the skin files) - meaning: when you are looking for the header stuff, you know where to look without thinking about it
3) Get a "feel" of the files. Example: You do not need to touch or add _html_footer.inc.php, just add any footer stuff to _body_footer.inc.php

Or another example: From this code-bit to this code-bit, it covers this feature/stuff.

One thing you'll achieve from this is you'll be comfortable with the system. Most of the "php" stuff are just cut-and-paste (ie, move it to where you want it). What you really need to be familiar with is where this div and that div should go.

You can go try the skin I ported called "Emerald". Click on my sig below. Download the b2evo version, then download the original version.

From there, you can do a comparison and see how I did it and where I placed and moved things.

^_^

Hope that helps.

3 Sep 13, 2009 15:54

It does help some and I appreciate your help. I was wondering, on the main file of the skin in v3 of b2e can you for the most part just put your original index.html body code in the index.main.php file like you would with version 1? That is still the same principal that I am going on from the previous version.

I did some stuff with the header. I checked out the index.main.php and noticed the php code was ''calling'' the header code from a remote file. So I figured that out. Thanks again!

4 Sep 13, 2009 15:58

Those b2e links for this site are the ones I have already been through that did not help me. There is literally nothing supported by b2e for 3.0 skinning. You would think they would release all the proper information with the upgrade release....

5 Sep 16, 2009 08:37

Hmm.. I'm assuming you came from version 1 based on your reply. What you need is actually the b2evo version 2 (aka Skins 2.0). - http://manual.b2evolution.net/Skins_2.0

It is the same as for b2evo v3.0, after that, if you wish to take advantage of the new stuff in v3, you can check this: http://manual.b2evolution.net/Upgrade_from_2.x_to_3.x

I am however not sure if the v1 method will still work with v3, theoretically it should, but there might be some stuff deprecated or renamed. And you won't be able take advantage a lot of the features introduced with v2.

I will say, give it a try :) Then from there, you can work on updating it to "Skins 2.0".

^_^

6 Dec 19, 2009 21:01

I totally agree that the instructions are not clear. I wanted to do the same thing - wrap the blog in my existing formatting - and every time I followed the online examples I ended up on pages about 0.x or 1.x.

This seems to be roughly the deal for a basic 2.x+ installation:

Copy or simply use the Custom skin. Into the _html_header.inc.php file put EVERYTHING from your existing design from the doctype to the opening DIV (or TD, or whatever) of the content area. Into the _html_footer.inc.php put everything from the ending DIV down to the /HTML tag. This brackets the blog content with every bit of your existing page.

Copy the _body_header.inc.php and _body_footer.inc.php from the root skins directory into your skin directory. They don't do much.

If you are using a different skin name, edit the index.main.php to reflect those new names in the two places where it skin_include()s the header and footer files.

Rename the '_skin.class.php' file that's in the custom theme; you don't need it and you'll get an error when you install the skin. Or you can fix the class name in it, but the skin works without it. I'm still learning! Upload everything else.

Go into backoffice and install the skin. Then edit your blog to select that skin. From backoffice you can then click on the blog itself to display it; it should look like your normal page with the blog stuff in the content area.

At that point you still need to format the blog content (with its CSS file) and probably select the widgets you want, but hopefully you are off to a basic start by now.

EDIT: one more thing you need to do is call out the skin's CSS file in the header of your design. So that goes into the _html_header.inc.php file alongside the CSS file that your site uses. If you really want to get into it, you can dig deeper into the b2e files and change them to call out existing styles from your site.

If you don't include the CSS from the skin, the display will be all wrong because that CSS controls the 2-column layout. Without it, you get one column.


Form is loading...