Nice
(account deleted) 05 Mar 2007 21:46
Yeah, that was helpful to me. Now, at least, I know HOW to get the CSS code onto the wiki… Whether or not it looks any good is a different question… :)
Design Your Own CSS Theme / Discussion
Forum
» The Community / Per page discussions
» Design Your Own CSS Theme
This is the discussion related to the wiki page Design Your Own CSS Theme.
(account deleted) 05 Mar 2007 21:46
I added some links to the basics section. Maybe one can find the answer to this different question there. ;)
Can anyone tell me how to simply change the background of an existing CSS theme??
It would be easier to help you if you provided a link to your site or told us which theme you are using.
I assume your site is [http://xplicit.wikidot.com/start] ?
Looks good - what do you want to change ?
Or - have you find it yourself and is the change done ?
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
@Lofty, I see you are using the orange-black theme from the Themes site. To change this you will need to set up a page on your own site to hold the changes. You might want to read my post at http://community.wikidot.com/forum/t-422137/need-some-help-with-css#post-1330975 which explains what you need to do.
Rob Elliott - Strathpeffer, Scotland - Wikidot first line support & community admin team.
Strathview ~ Wikidot-based wikis, websites & intranets and online database development. For community groups, villages, charities, business and government.
I spent hours looking for this info. Not a single tag mentioning color or how to tweak a theme! I better get studying CSS! Thanks for the free blog!
Just go to http://www.blogger.com/start and sign up for a blog there - they're a great blog provider. Using a wikidot site as a blog would end up being a hassle after a while .. lol
If anyone is interested in contributing to another site dedicated to CSS among other things, check out http://hard-drive.wikidot.com and apply for membership.
Cheers
Shane Smith ★ Website: Wikidot Development & Programming.
STE Wikidot Editor: Windows & Mac OS X. ★ Try it for free!.
I'm also on Twitter, follow me there! ;-)
check out http://hard-drive.wikidot.com and apply for membership.
er…. how do i do that then?
er…. how do i do that then?
Yeah, it's been blocked from new membership by the other site admin I am working with. I'll see if I can fix that up now, or at least ASAP. Check back there in a few days.
Sorry about that…
EDIT: ok, ready for new members now :)
Shane Smith ★ Website: Wikidot Development & Programming.
STE Wikidot Editor: Windows & Mac OS X. ★ Try it for free!.
I'm also on Twitter, follow me there! ;-)
Yeah, me 2!!!!!
Thank you so much!
I'm trying to add a logo to my wiki. I would assume I should do that in the css and I have been messing around wiht it but I can't seem to figure it out. I've tried copying the code for the background image in the header and tried changing the coordinates but my image wont show up.
If anyone is interested in doing it for me :) I just want the image found below in the upper left hand corner of the default Flannel layout.
http://christmas4kids.wikidot.com/local--files/start/logo
Thanks much for any help.
In the custom themes section of admin:manage, make a new theme that extends the flannel theme and put the following code:
#header{
/*background: none;*/
height: 9em;
border-bottom: 3px solid #800202;
background-image: url(http://christmas4kids.wikidot.com/local--files/start/logo);
background-repeat: repeat-x;
background-position: 0 2.1em;
}
You will need to re-upload your image and make sure it ends in a valid for (ex: .jpg .gif .bmp) - This is your problem
-Tehraptor
Changed the universal background colour (yes spelt it correctly in the css, US style) and made sure there were no conflicts but refuses to change from default used by co. Any particular reason?
This will do the trick
do the following:
- Paste the following code in a simple word processor like notepad
[[include :css-competition:include:easylogo |
logo-image = YOUR-URL |
logo-width = 500px |
logo-height = 150px |
header-height = 200px |
]]
- Replace in the following URL YOURSITE with the name of your site http://YOURSITE.wikidot.com/nav:side
- Navigate to that link
- Select "files" from the action-buttons at the bottom of the page
- Upload (following the instructions) your logo.
- If the instruction "refresh list" appears click on it
- Now there is probably a list (One item) with "info|option" at the end
- Click on info
- Select from the popup-window the URL from the image, its under the picture on the second line and starts with "http://…"
- Press ctrl-C to copy it
- Close this window by pressing the close button
- Go to the word processor and replace YOUR-URL with what you just copied
- Now select the code from the word processor and press ctrl-C
- Go to your browser and select "edit" from the action-buttons at the bottom of the page
- go to the end of the code
- Paste (ctrl-V) the the code
- Save the page, press Ctrl-S or "save"
Maybe you need to adjust the width and height that are given by default.
Try it, if it does not work or stops working write me a message
Having struggled a lot to follow these instructions I thought a few extra pieces of information might help - so I've added them. That might be a bit presumptuous, but it's probably simpler than any other options. I won't be offended if someone edits/undoes my changes.
Fine, it is clearer now.
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
"Theme" didn't t mean anything to me for a while and neither did CCS ( Cascading Style notes)
It might be good to start this page with something like this.(It may be off base — I am new.).)
A theme is a structured template that provides specific directions that control the appearance of pages. When complete, the template establishes the fount to be used, its size, the location of text, any back ground color, specific images to be used and their location. (and other things that I don't know.)
The theme starts with a basic template and modifies and adds to it, using a markup language called Cascading Style Notes (CSS)
Am I in the ball park? If yes, please modify it and place it at the top of the page.
Regards, Jack
Can we import CSS from other places, or must we use wikidot specific theme modification only? Thanks!
You can import any CSS using
@import url(http://some.place.com/style/some-stylesheet.css);
in your CSS.
But remember that any import must go before the rest of the content.
Piotr Gabryjeluk
visit my blog
Hey I think you mentioned that when we import CSS from other places the import should go before the rest of content. I am trying to import CSS themes i downlaoded from otehr websites, but i do not know how to upload the entire content as i know that for the theme to work all files (not jsut the CSS) should be uploaded while keepign structure of folder. Can you tell me how i should proceed.?
Thanks
You can't use a folder structure on Wikidot sites as you would do with a "normal" website.
To use a theme from another site you would need to import the CSS as a file on your site somewhere and then point to it in the @import rule at the top of your custom CSS. (Although I would normally put the CSS rules onto their own page inside [[code type="css"]] .. [[/code]] tags and point to the codeblock on that page).
You would also need to upload to the page holding your imported CSS any images that the theme required and make sure that in the CSS the links to them - ackground-image:url (/local--files/pagename/imagename.jpg) - is correct.
You then need to bear in mind that importing CSS from another site will almost certainly not work without quite a bit of manual work after that: the rule names we use here are usually different and I have never known an imported css from outside Wikidot work first time.
Rob Elliott - Strathpeffer, Scotland - Wikidot first line support & community admin team.
Strathview ~ Wikidot-based wikis, websites & intranets and online database development. For community groups, villages, charities, business and government.
Have a look at http://vineyard.wikidot.com/supernatural:css which is just a test page. It imports its css from http://vineyard.wikidot.com/supernatural:css2 then adds a bit more. You'll see the syntax used for the @import.
Rob Elliott - Strathpeffer, Scotland - Wikidot first line support & community admin team.
Strathview ~ Wikidot-based wikis, websites & intranets and online database development. For community groups, villages, charities, business and government.
I don't know anything about CSS, but I managed to change the most colours in the Cappucino theme. But can any one please tell me how I can change the colour of the text on the pages???
Please! I need your help!
Have a look on the howto:
Basics contains some important links for the syntax of CSS:
http://community.wikidot.com/howto:design-your-own-css-theme
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
#main-content{
margin-right: 0;
margin-left: 16em;
padding: 0 1em;
color:green;
}
in the theme creation page in site manager, it says the seperate css file is recommended, here it says directly into the box is recommended.
EDIT: here is the "extra" file named like ( "css:mytheme") recommended!
Both can be correct… the diffrence is the "mass of changes" you want to do in CSS.
If you have only ONE thing changed than the direct entry is enough to key in. For a "howto" it is easier to concentrate on little entries.
If you want to experiment more and more - than it is a very good idea to put your CSS code in extra pages - only to save them and to have the history(!) if something goes wrong. This was the first idea of Michal ( the developer of ikidot).
Hope this makes it clearer.
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
Hey i want my wiki site pe egr .wi kidot.com to customize like ht tp: //w ww. c heap t-cav ta.com c hea est-c aver or like http: // ww w. tru harma.com can anyone help me out regarding this and also i want to know that how can i remove the search box from my wiki site, it will be done by customizing theme.
Any suggestions please.
Jeff Turner
Edit: cleared the links and names no spam on our community site forum with adsense to your wiki.
You have to read all about CSS theme. Go to search center ( left menu) and search for CSS or theme . This is the only way to change the layout.
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
I am hoping someone can help me troubleshoot my css problems:
I am trying to get the css from RubyX template to work on my wiki: http://crazyhappenings.wikidot.com
Here is what it is supposed to look like: http://www.kendahlin.com/demo/rubyx/index.html#
I attached all the image files to this page: http://crazyhappenings.wikidot.com/css
I then took all the code from main.css and replaced the existing url reference with the urls from my wiki. That part seemed to work.
But, it appears to be the code that is messed up.
Is the base code getting in the way?
How can I troubleshoot this problem?
I've spent a long time reading up on css and I can't seem to get past this!
Any help would be much appreciated. Thanks.
regards, crazyhappenings
/forum/t-205/design-your-own-css-theme#post-
