Advertise Here

Author Topic: [Guide] Admin CP Manage Styles  (Read 10347 times)

0 Members and 1 Guest are viewing this topic.

Offline simply sibyl

  • Helpers
  • *
  • Posts: 14347
  • On hiatus
    • View Profile
    • The Tent Dwellers

  • Total Badges: 31
    Badges: (View All)
    Level 6 Poll Voter Webmaster Arcade Highscore Windows User
[Guide] Admin CP Manage Styles
« on: April 30, 2010, 06:02:07 pm »
Manage Styles Section
This section of the Admin Control Panel was added by SMF for Free to give you the ability to:

  • Create and modify stylesheets
  • Customize some images on your forum
  • Create custom tabs
  • Edit your header and footer area
  • Submit a stylesheet you have created directly from your forum to styleyourforum.com

This guide will attempt to explain all of these options.




Main  

The Style Picker
Use the style picker to select the stylesheet you want to use

Sample Styles
Click the thumbnails on the page to install one of the sample styles on your forum.
Each style that you install will also be listed in the style picker after you install it.



Creating, Modifying and Deleting Stylesheets  

Create

Options:
1.  Create a style from scratch using the visual Style Editor, filling in the boxes, to make changes to the style:
     Click the "Create" tab
     Style Name:  Type in a name for the style
     Make the changes you want to make then go to the bottom of the page and click "Create Style"
     If you need to make more changes click "Modify Style", choose the style in the stylepicker, click "Pick Style"

2.  Create a style by editing the css directly.
     Click the "Create" tab
     Style Name:  Type in a name for the style - go to the bottom of the page and click "Create Style"
     Click the "Modify Style" tab to edit the style you just created.

3.  Use a stylesheet you found here at SMF for Free Support or http://styleyourforum.com/
     This index lists hundreds of stylesheets created by members of SMF for Free:
     Stylesheet Index
     Looking for a Holiday Stylesheet?  You'll find Christmas, Easter, Valentines Day, Halloween and many more here:
     Holiday Stylesheets    

     How do you install the stylesheet?
     This page will show you how to do that and includes pictures to give you a visual aid.
     How to add a stylesheet


Modify
This is where you can Modify the stylesheet you just created, or Modify one of the other styles installed on your forum.

Click the "Modify Style" tab
Use the style picker to choose a style to Modify then click the "Pick Style" button.
To Modify the css directly:  Go to the bottom of the page.
You will find a white "box" with the css in it.  
This is where you make changes to the css to Modify your stylesheet.
After you are done making changes click "Modify Style" at the bottom of the page.
Refresh your browser to see the changes.

This Thread has has many helpful links and tips to help you with creating a stylesheet.  
There is also a post in the thread that contains a breakdown and explanation of the css.
Stylesheet Making Tips/Helpful Links
      
Delete Style

Click the "Delete Style" tab
Using the style picker choose the style you want to delete
Click:   "Pick Style"



Customize Images  

Use this page to change some of the images/icons on your forum.  
*Note:  not all images on this page can be changed.
For those that cannot you can use this to swap the images:  Swap Images Generator and Guide
      
To use your own custom images
Upload your images to an image host (Photobucket, Imageshack, tinypic, etc)
Get the "Direct Link" to the image
Look for the image you want to replace on the Customize Images page.
Replace the URL for the image with your URL.

Click "Save Images" at the bottom of the page

Imagesets:
If you have several stylesheets that you swap now and then you can create a different image set for use with each stylesheet.    

Type in a name for the image set at the bottom of the Customize Images page and save it.
When you change stylesheets go back to Customize Images and choose the Imageset for that stylesheet.
 


Headers/Footers  

You can edit the Header and Footer areas of your forum here.   Html and scripts can be used here.  

Click the "Headers/Footers" tab

To edit your forums Header:
Paste your html code in the Header box.
Click "Save Headers and Footers"

To edit your forums Footer:
Paste your html code in the Footer box
Click "Save Headers and Footers"

To clear (remove) your header or footer codes
Click "Clear Headers" and/or "Clear Footers"

To save a backup copy of your Header and Footer code:
Click "Download Headers and Footers"
You will get a page with your header and footer information on it.
Copy the information.
Save it to a file  (something like Windows Notepad)

Be very careful when editing your Header or Footer as html and scripting mistakes could mess your forum up.  If you are sure a code you placed in your header or footer area has messed up your forum read here before posting a support ticket:   Code Messed Your Forum Up? Check here FIRST!!



Custom Tabs  

Use Custom Tabs to create a new link in the tab bar.
You can use it for external URLs
You can create webpages using the webpage editor then use Custom Tabs to create a Tab(link) to get to the page.
You could use it to go to a specific section of your forum...     Forum Rules?    Whatever you like

Click the "Custom Tabs" tab
Title:   Type a name for the tab
URL:    Put the url here
Click "Add Tab"

To remove a Custom Tab:
Click the box across from the Custom Tab you want to remove (under the Remove column)
Click "Save Settings"



Submit Style to Styleyourforum  

This page is for submitting stylesheets you have created to http://www.styleyourforum.com for others to use.
Please only submit styles that you have created.

In order to use this page you must have an account at http://www.styleyourforum.com
You can Register here

Ready to submit your stylesheet?
Do you have custom images for the style?    Make sure to create an Imageset for it on the Customize Images page.
This is basically fill in the blank.  
Put in your username and password.
Choose the stylesheet and the imageset for the style in the dropdown boxs
Title:  Type in a titile for the stylesheet
Category:   Choose which category your style would best fit in
Description:  Type in a Description of your stylesheet
Click the Submit button

Once it has been submitted and you get the notice that it was successful it would be a good idea to go to http://www.styleyourforum.com and be sure it looks okay.   If you have Header or Footer codes that need to be used with the style you can edit it there and add them (at the bottom of the page)   When posting the stylesheet here at SMF for Free support you can use the css and custom image links from styleyourforum.  You can also post the Preview page.
« Last Edit: April 30, 2010, 08:40:49 pm by simply sibyl »

Offline BLiTz

  • SMF For Free Newbie
  • *
  • Posts: 10
    • View Profile

  • Total Badges: 5
    Badges: (View All)
    Topic Starter Level 1 10 Posts First Post One year Anniversary
Re: [Guide] Admin CP Manage Styles
« Reply #1 on: September 08, 2010, 11:20:13 am »
oh i see :)

 

Related Topics

  Subject / Started by Replies Last post
5 Replies
1949 Views
Last post June 11, 2006, 09:23:56 pm
by Bailey
2 Replies
1417 Views
Last post May 31, 2007, 12:38:03 pm
by rileyks
4 Replies
1780 Views
Last post July 14, 2007, 05:12:28 pm
by Hermione47
11 Replies
2503 Views
Last post January 22, 2008, 08:39:30 pm
by simply sibyl
3 Replies
3873 Views
Last post September 23, 2012, 09:35:29 am
by SMF For Free