2008-10-17, 15:39 | Link #1 |
sleepyhead
Author
Join Date: Dec 2005
Location: event horizon
|
Customizing animesuki [Tutorial/Help in First Post]
In this thread you will find information on how to change the look of the forum (know that not everything is possible). It is presumed you do not have knowledge of things such as Cascading Style Sheets (Css) or HyperText Markup Language (HTML). It is however presumed you know how to edit a simple text file; which is required for some browsers.
For the more knowledgeable: This is not a personal thread so feel free to contribute to it as you wish, but please have a code comment in the format /* === Title of Code === */ at the start of your code snippets. info: if I say hit Ctrl+F5 what I really mean is: "while holding down Ctrl, press F5" Preliminaries: Setting up your browser Please read the paragraph related to your browser Firefox Get the Stylish plugin @ Firefox Add-ons. After installing it, in Firefox go to Tools ⇨ Add-ons ⇨ (find Stylish in the list and select) Options. You are now in the Stylish window. Select Write..., for the description type in Animesuki Forums and in the big box paste in the following: Code:
@-moz-document domain(forums.animesuki.com) { /* Add code snippets between the two ant lines bellow ---------------------------- */ /* ---------------------------- Don't delete the closing curly brace bellow. */ } (the plugin Stylish will also work for Flock and Thunderbird) Opera First create a text file, then open it and go to File ⇨ Save as.... As the name type "userstyle.css" (including the quotes) and save it somewhere where you feel you won't want to move it later. After you save it, go to Opera and in Tools ⇨ Preferences ⇨ Advanced ⇨ Content ⇨ Manage Site Preferences... click the Add... button. Select the tab General and in the field Site type forums.animesuki.com then go to the Display tab and in the My Style Sheet field browse & select the file you created earlier. Hit Ok, close etc and all done. You can now add code to your file to make things happen. If Opera is open while you edit the file, hit Ctrl+F5 to force it to update to your latest changes. OmniWeb Check out tutorial by chikorita157! (customizing sites in the following browsers won't work) Safari It's not very complicated but (unfortunately) currently it is impossible to do for the forum. The following is a description of how it is done in safari. Note that it is technical. Go to Preferences ⇨ Advanced ⇨ Style Sheet. There you can set the stylesheet. Now Safari (like most browsers) doesn't have support for site-specific-styles but there is a trick (which in the case of the forum won't work). To make Css rules site specific the trick is you find something that can't possibly be in another website (e.g. body[title="Animesuki Forum"]) and proceed every rule with it. The style sheet will still be global but the rules won't do anything on other sites. Internet Explorer Not doable, same as with Safari. Reference path, to set custom user styles go to
Not doable. Same problem as with Safari. For reference the setting path is Settings ⇨ Configure Konqueror ⇨ Stylesheets ⇨ General Google Chrome Unknown, sorry. I'm am going to guess there is a css file somewhere in chrome which you could edit in a manner similar to safari to enable you to customize the forum. If you're using Chrome just for the style there are alternatives in other browsers: Firefox's Chromifox, Opera's Chrome Theme. Netscape Not doable, same problem as with safari. But for reference you must save the style under the name: userContent.css in your user profiles (the Safari problem applies). Also Netscape as a browser is no longer supported. Preliminaries: How to work with code snippets Just some explaining Here's how it works if you've finished setting up your browser then what you need to do now copy Css code snippets to make things happen. I've written some bellow with the more often requested or otherwise mentioned fixes, as well as a few others. Read the description for more details on what each of them does. If you like the snippet just copy/paste the code in the snippet to your add-on or css file. Refreshing the page or in some cases (for some browsers) restarting the browser may be necessary to see the effects. Code snippets The code you need to make things happen
More: [1] [2] Last edited by felix; 2009-04-08 at 23:21. Reason: Update. |
2008-10-19, 07:40 | Link #3 |
sleepyhead
Author
Join Date: Dec 2005
Location: event horizon
|
I've tested them for meeting the objective and also for any unwanted side-effects (I'm using a lot of them as small fixes to the forum right now). You don't have to worry about the Css3 selectors, the only two browsers that support site-specific usestyles also have excellent Css support.
__________________
|
2008-10-19, 07:52 | Link #4 |
…Nothing More
Administrator
Join Date: Mar 2003
Age: 44
|
Very nice. The only downsides to this are that it:
|
2008-10-19, 10:59 | Link #5 |
ISML Technical Staff
Graphic Designer
|
This might be a bit off-topic but Portable Apps for Firefox 3.1 just came out recently. It's exactly what it is; you can run FireFox from your flash drive with your own personal settings, cookies, bookmarks, etc... This might be useful if you want to take your own personalized browser with you.
__________________
|
2009-01-01, 15:10 | Link #7 |
sleepyhead
Author
Join Date: Dec 2005
Location: event horizon
|
Changing the font for the entire forum is specified in A. of the list in the first post.
If you only wish to change the font in posts. Custom Typeface [post-only]For your second question, Code-Tag Custom Typeface
__________________
|
2009-03-28, 12:30 | Link #8 | |
sleepyhead
Author
Join Date: Dec 2005
Location: event horizon
|
*Cats thinks banners rotate too fast*
Te he he.-------------------------- One by Slice of Life, Quote:
Code:
/* === [Spoiler] All Open === */ .spoilerbox {display: block !important;} Last edited by felix; 2009-03-28 at 12:46. |
|
2009-04-08, 22:57 | Link #11 | |
ひきこもりアイドル
IT Support
Join Date: Feb 2009
Location: Pennsylvania , United States
Age: 35
|
Quote:
Also, now it can be downloaded for free.
__________________
|
|
Tags |
faq, forum, style |
|
|