The MU forums have moved to WordPress.org

Custom CSS Plugins for Wordpress MU (44 posts)

  1. rizapn
    Member
    Posted 15 years ago #

    For someone who interesting about adding a "Custom CSS" feature for wordpress MU users, just go to http://rizapn.blogsome.com ...

    Any feedback or comment, please put there ...

    RizaPN

  2. Ovidiu
    Member
    Posted 15 years ago #

    I tested this and as all other similar solutions, it has one point of failure as far as I can see:

    It just assumes the file structure exists already, i.e. in my case I get all these warnings:

    Warning: filesize() [function.filesize]: stat failed for /var/www/web5/web/wp-content/blogs.dir/1/files/themes/edu-clean_style.css in /var/www/web5/web/wp-admin/wpmu-custom-css.php on line 57

    Custom CSS Files

    Warning: opendir(/var/www/web5/web/wp-content/blogs.dir/1/files/themes) [function.opendir]: failed to open dir: No such file or directory in /var/www/web5/web/wp-admin/wpmu-custom-css.php on line 85
    * No file found !

    Having said that I would like the plugin to create the structure if not found, can we do that? I mean most of my blogs, arecreated, then users start browsing through the backend, without first uploading anything, so ...blogs.dir/BLOG_ID/ exists but the rest of the structure doesn't.

  3. rizapn
    Member
    Posted 15 years ago #

    Please re-download the latest zip file ...

  4. Ovidiu
    Member
    Posted 15 years ago #

    ok, with the new version the errors are gone. I saved, and see the file on the right side now.

    by testing I foudn out, the plugin creates a css file for every theme, i.e. the css fiel is not applied to any theme I would activate.

    seems a nice plugin, although I am not sure yet if I prefer this solution to having one global css fiel applying to any theme I activate...

    THX :-)

  5. tdjcbe
    Member
    Posted 15 years ago #

    Clicking on the "Read more details" link gives me this:

    Your search - custom css plugins wordpress mu - did not match any documents.

    Suggestions:

    * Make sure all words are spelled correctly.
    * Try different keywords.
    * Try more general keywords.
    * Try fewer keywords.

    Granted the article is further down the page, have to admit that it;s a pain.

    What security is in place to prevent problems?

  6. rizapn
    Member
    Posted 15 years ago #

    @ovidiu: Previously, I use a global css (not depend on the theme), but then I found that some theme use different id in their CSS file. For example, Theme A use .title but theme B use .content h1 (both are referring to the same post title). That's why I decided to use a different CSS for each theme.

    @tdjcbe: That is my trick to put [Google Adsense for Search] in almost all of my articles, because [Google Adsense for Content] is disabled from my country :( I still try to find the better way ...

  7. nonegiven
    Member
    Posted 15 years ago #

    ... I have had no luck with this at all I am afraid.

    There is no readme.txt, no real instructions on the website and VERY little to no documentation anywhere. Rizapn, please consider adding instructions. Thank you.

    The plugin contains two files;

    ccss.php > /wp-content/mu-plugins
    wpmu-custom.php > wp-admin

    I upload them and make permissions 755.
    It does not say to where but I upload an alternative image 'alt.gif' to the same directory as the current template ....

    *** Does this need to be in 'default' template or can it be the edited template's directory.

    A very simple page appears in Site Admin > Design > Custom CSS

    It does not say how much of an edit one has to make so I attempt adding a complete string from the hash

    #home{background:transparent url(images/alt.gif) no-repeat;width:990px;height:250px; margin:0 auto;list-style:none;}
    .right-col{width:240px;float:right;padding-right:5px;padding-left:5px;padding-top:30px;color:#fafafa;}

    Custom CSS shows a custom css based on that edit and it appears to make directories in /blogs.dir/$blog_id/files/themes/

    I refresh browser's cache, try alternative browser ... no difference. No change.

    Am I missing something?

    It could be great but ... I cant see where I have gone wrong. Any assistance appreciated.

    It would be nice to have a little bit more feedback, e.g. the page showing the list of alternative images etc. Perhaps the ability to edit which directory one's alternative images sit in. Some folks might appreciate a web interface to upload alternative images to. It would be wonderfully simple.

  8. rizapn
    Member
    Posted 15 years ago #

    If you already see Custom CSS sub-menu and able to save the modified CSS file, then the plugin already work.

    Your question is more about CSS itself.
    For url, try to put a complete url, for example : url(http://your_mu_server/mu_user/files/2008/10/alt.gif)

  9. nonegiven
    Member
    Posted 15 years ago #

    I do not think it is about css ... I spent hours on this. Nothing works so far. I cant even change an attribute such as a background color. Even though the edits stick on the custom-style.css.

    I have tried the full URL, e.g.

    http://example/wp-content/themes/theme/images/example.gif

    and I have tried all sort of server paths, e.g.

    /usr/home/wp-content/theme/theme_name/images/example.gif
    /public_html/path/image.jpg etc

    ... I have tried moving the image to root. NOTHING works.

    Looking at the index page source, I see BOTH the original style.css and the custom-style.css listed.

    <link rel="stylesheet" href="files/themes/custom_style.css" type="text/css" media="screen" />

    "files/themes/custom_style.css" is obviously not the full path for where the custom css sheet. It is;

    'example.com/public_html/wp-content/blogs.dir/1/files/themes/custom_style.css'

    Does this need fixed? How far do I have to go to name the image? Full server path or relational from the plug in or template?

    Does the problem might lie with where you determine the path to be;

    files/themes in ccss.php

    I do not think it is even loading.

    Could be a wonderful plug in but I think it needs more work, e.g. a path checker or preview to see if things are working.

    Good luck ... but help!

    BTW, do I have to input an entire css or just change the elements that I want to change? have tried both.

  10. rizapn
    Member
    Posted 15 years ago #

    "files/themes/custom_style.css" is a relative path from the main users path (for ex. http://wpmu_server/user_blog). It works with no problem in my tests (I test it in 3 different wpmu servers).

    If the file wp-content/blogs.dir/$blog_id/files/themes/custom_style.css is exists, then [Custom CSS] is OK. Try also to display the CSS using its url, http://example.com/public_html/wp-content/files/themes/custom_style.css is it work or not?

    You only need to modify CSS on element side, no need to write them all.

    I wrote the updated Custom CSS plugin and put it in my blog. Try to use that version also. No functionality change, only the coding (use only 1 file instead of 2).

  11. nonegiven
    Member
    Posted 15 years ago #

    Hi.

    the link is; http://rizapn.blogsome.com/images/ccss.jpg

    OK ... I see that it is not a jpg at all ...

    Firstly, I notice that it does not recognise or remove any previous custom_style.css sheets that the old plugin made. It might be good to look at that.

    Secondly, it does not work ...

    Are you working on a Windows server? Because I am working on a UNIX server and perhaps the paths work differently.

    Can you clarify if one has to replace the ENTIRE css sheet or JUST the changed element?

    It should just require the changing of;
    #home{background:transparent url(images/original.jpg) no-repeat;width:990px;height:250px; margin:0 auto;list-style:none;}
    to
    #home{background:transparent url(images/custom.jpg) no-repeat;width:990px;height:250px; margin:0 auto;list-style:none;}

    I have tried it with full working URL, e.g. #home{background:transparent url(http://example.com/wp-content/themes/theme-name/images/lily.jpg

    and various server paths.

    I think you need to do more work clarifying and simplifying this, e.g. have one default folder for all new custom images to go into and some sort of path checker.

    BOTH stylesheets show up in the page source but custom_style.css does not super-impose itself.

    Thanks.

  12. nonegiven
    Member
    Posted 15 years ago #

    I say "should work" because 'images/original.jpg' and 'images/custom.jpg' are sat right next to each other.

    Perhaps if you wanted to get really fancy, you could add a preview window so show it is working. Also add an uploader/list for alternative images etc.

    I tried;

    #home{background:transparent url(public-html/wp-content/themes/autumnleaf/images/lily.jpg) no-repeat;width:990px;height:250px; margin:0 auto;list-style:none;} etc.

    Permissions are fine, 755 for php files, 644 or 755 for images.

  13. nonegiven
    Member
    Posted 15 years ago #

    I am also using sub-domains rather than directories. I do not know if that make a difference, e.g.;

    blog.example.com

    and not

    example.com/blog

    It does not work in either the main blog nor users blog.

    I cannot see the .css and certain not by the URL which given in the source.

    <link rel="stylesheet" href="http://example.com/files/themes/custom_style.css" type="text/css" media="screen" />

  14. Ovidiu
    Member
    Posted 15 years ago #

    well, it works for me with subdomains:

    http://sasha.zice.ro and the custom css file is loaded here: http://sasha.zice.ro/files/themes/blue-moon_style.css it jsut contaisn soem small fixes for this user.

    Btw. I am still using the old version.. any need to update?

  15. rizapn
    Member
    Posted 15 years ago #

    @Ovidiu : no need. The latest ones is more clear in term of code. That's it. nothing new ...

    @nonegiven :
    - You MUST check weather the custom_style.css is created correctly or not. If not, then the problem is in file creation permission (I don't think about it, because the custom_style.css is written in the user's upload path).
    - For url, better if you use url(http:// ...) and NOT without http:// OR please understand what relative path means ...
    - For CSS, you can write ONLY the part that you want to modify, no need to rewrite them all (please DO NOT ask it again, I did answer it before)

  16. Ovidiu
    Member
    Posted 15 years ago #

    @nonegiven:

    could you give us a link to a site where you are trying to implement this so we could check what could be wrong?

  17. tdjcbe
    Member
    Posted 15 years ago #

    I ask again. What security is in place for this plugin?

    Can we also please knock of the sig tags? Thanks.

  18. rizapn
    Member
    Posted 15 years ago #

    @tdjcbe: What do you mean with security? You can read the whole plugin code to find if there is something strange. Your first reply is related with my blogsome, not this plugin.

    What you were see when you click that link is Google Adsense (for Searching) output ...

  19. andrea_r
    Moderator
    Posted 15 years ago #

    He means security as in XCSS vulnerabilities. Anything in place for that?

    Also, putting a link to your blog at the bottom of every single one of your posts is not allowed.

  20. tdjcbe
    Member
    Posted 15 years ago #

    Actually I did ask about security in my first post:

    What security is in place to prevent problems?

    I see from scanning it that all you;re doing is running it through kses. I know from previous discussions that that may not be enough for protection for cross css vulnerabilities.

    A good read:

    http://htmlpurifier.org/comparison.html

  21. rizapn
    Member
    Posted 15 years ago #

    @tjdcbe: OK, sorry to not understand your question clearly. I was not thinking about that issue when I wrote that plugin. The plugin just add a single stylesheet link to the page, provide an interface to edit that custom css file (filter the file name to reject other unallowed files) and nothing more.

    @andrea_r: that kind of linking is not allowed here. Hmm, ok then ...

  22. nonegiven
    Member
    Posted 15 years ago #

    I cant speak about security ... but I can say that in my installation, I cant read the css file in a browser. I get a 404. What permissions are you using for "blogs.dir > files > themes > custom.css"? I am on 755 all the way.

    The plugin makes the file and directory but does not show.

    Sorry, I have a test bed in progress at; http://csstest.vegan.jp/

    I am trying to swop;

    http://vegan.jp/wp-content/themes/animecat/images/head.jpg

    for

    http://vegan.jp/wp-content/themes/animecat/images/ant.jpg

    the custom file is animecat_style.css

    To be honest, I cant even get the page to change a color.

    rizapn,

    I hope you understand that I offer this bug testing in goodwill. One other suggestion I would make is for the plugin to load the standard css to make it easy to apply an edit. It should just work ... Keep in mind a default folder for images.

    Thanks

  23. Ovidiu
    Member
    Posted 15 years ago #

    The plugin makes the file and directory but does not show.

    Do you mean that the file is physically there? did you log in with ssh or ftp and check?

    Because it gives indeed a 404 error...

    From the plugin's backend, can you edit it? No errors?

    If you log in with ssh, and do a ls -al animecat_style.css in the right folder, what do you see?

  24. nonegiven
    Member
    Posted 15 years ago #

    I used FTP.

    http://vegan.jp/public_html/wp-content/blogs.dir/33/files/themes/animecat_style.css (you can skip the public_html bit if you want)

    Yes, via the 'Edit Custom CSS page', I can see the custom stylesheets, load them, edit them save them ... but they have no effect whatsoever.

    It also comes up with a 404 at http://csstest.vegan.jp/files/themes/animecat_style.css

    Look, I think this is plugin a great idea. I think it does a job that needs to be done. But I am not entirely stupid. There is something not right about ... or that needs to be developed further, e.g. standardised directory for alternative images etc.

    The bottomline is, it should just work and it should come with instructions that make it work. I am willing to help to work towards that.

    Rizapn, I do understand what a relative path is. What kind of server are you working on?

  25. rizapn
    Member
    Posted 15 years ago #

    @nonegiven: I try it on both, linux (RedHat+Apache) and windows (XP+Apache), with no problem at all.

    I don't know what is going wrong in your case. Please goto Site Admin and check what is the value of [Upload Path] and [Fileupload Url] for that csstest blog/site. Hope it can help me/us to solve your problem.

  26. nonegiven
    Member
    Posted 15 years ago #

    Upload Url Path is wp-content/blogs.dir/33/files

    Fileupload Url is http://csstest.vegan.jp/files

    I am on FreeBSD but at present using shared hosting with cPanel interface.

    Thanks.

  27. nonegiven
    Member
    Posted 15 years ago #

    And come to think about it, there is no way to enable or disable custom themes from this plug in without going into FTP and deleting them off the server ... and assigning or excluding them from individuals blogs is all manual.

    Come on, bro, its admirable that you want to develop plugins for WP, and this is a good idea, but I think this one needs a little bit more work to finish it.

  28. Ovidiu
    Member
    Posted 15 years ago #

    @nonegiven:

    this plugin works. I am in no way affiliated with the author, just downloaded it, gave it a try and it worked out of the box for me. check here: http://sasha.zice.ro check its extra stylesheet: http://sasha.zice.ro/files/themes/blue-moon_style.css it works perfect.

    regarding your remarks:

    standardised directory for alternative images etc.

    what do you mean with alternative images? this is not something like the custom header image enabled themes... If a user wants another header image in a theme that doesn't support custom header images and wants to do it via css editing, now he can. If he knows enough css for that, he also knows how to upload an image and then use that images url to use inside his css code...

    there is no way to enable or disable custom themes from this plug in without going into FTP and deleting them off the server ... and assigning or excluding them from individuals blogs is all manual.

    I think you misunderstood this plugin from the start. Its not about custom themes but about allowing users to edit css and use their own css.

    I.e. one of my users likes a particular theme, but wants its background blue instead of red, so with a couple of simple lines, he can achieve this on his own :-)

  29. nonegiven
    Member
    Posted 15 years ago #

    What does editing css do if not customise themes ... !?! No. All I want is to run a multi-blog site one theme, but a different images for each blog. Out of the box, it wont even change a color. All I want to do is change one image on the home.php page ...

    I was approached by the author (and another) who suggested it could do what I asked. Actually, I don't want the user to be able to customise it but I can fix that. See; http://mu.wordpress.org/forums/topic.php?id=9954. The only other way to achieve this it is to have a near identical and separate template for each blog and a pain to support/upgrade/set up.

    I think the same rules apply, one wants to be able to delete created custom csses. I am just making fair suggestions.

  30. Ovidiu
    Member
    Posted 15 years ago #

    ok, I got your points, but under customized themes I understand. something unique, i.e. using this plugin: http://wpmudevorg.wordpress.com/project/Userthemes-Revisited

    If you don't need all features that plugin offers, you could always try this one: http://jason.lah.cc/2006/04/08/jasons-customciser-customise-your-themes/

    If you want all your blogs to have the same theme but with a different css you could also use a customized header enabled theme, so your users, could upload their own header image, i.e. mandinga theme? I think that one is included in Farm's theme pack available on wpmudev.org

    I just noticed you don't want your users to be able to customize the theme themselves? This means if you want to use this plugin, you would have to manually customize the themes, and save the customized files inside each users directory?

    Anyway, now that I start to udnerstand, I hope the links I gave you helped.

    good luck.

About this Topic