Lars282 Posted March 9, 2012 Share Posted March 9, 2012 Hey. I am using TinyMCE to add articles to my website. They are arranged in categories, each category has a specific colour (assigned via textfield on the processwire page corresponding to the category) which is used for each article that belongs to it. Have a look: http://aglobalvillage.org/journal/issue6/planet/essay1/ It seems straight forward how to use the colour on all articles that are children of a category. But is there a simple way of using that colour in the TinyMCE field of the article? At the moment, you need to enter the hex code again and again to have some lines of the block quotes in colour, and it is not easy to change afterwards. Is there a way that I can simply somehow mark in TinyMCE which line should be coloured, rather than applying the colour directly in TinyMCE? Hope it is clear what my problem is. Many thanks in advance, Lars Link to comment Share on other sites More sharing options...
diogo Posted March 9, 2012 Share Posted March 9, 2012 As I understand, you want to apply the color to emphasize those lines. I think it would be best to do it with css. So, just make those lines "Italic" on the text area, and colour them with css, based on the class of that article: article.category1 em {color:'blue'}; article.category2 em {color:'red'}; article.category3 em {color:'green'}; article.category4 em {color:'yellow'}; EDIT: or choose "bold", or "underline" instead... but i would say that em is more semantic in this case Link to comment Share on other sites More sharing options...
ryan Posted March 9, 2012 Share Posted March 9, 2012 To assign the class to your article, like the one in your link (a full page article) you could add the category name to your <body> tag. <body class="<?php if($page->category) echo $page->category->name; ?>"> Then in your CSS file, you would do like what Diogo suggested: body.climate #article em { background-color: #07ABBA; } Link to comment Share on other sites More sharing options...
Lars282 Posted March 11, 2012 Author Share Posted March 11, 2012 Thanks for your replies! I already have a field in the process wire admin defining the colour of the section, so I would prefer to use that one rather than defining it it the css file -- especially since new sections/categories will be added frequently. Any idea how that would be possible? Worst case, I maybe can process the $page->$tinymcecontent with PHP, searching for some predefined tags like [X] coloured text [XX] and replace them with some <span style="color: $page->parent->category_color">. But I am hoping there is a cleaner way of doing this! Thanks, Lars Link to comment Share on other sites More sharing options...
apeisa Posted March 11, 2012 Share Posted March 11, 2012 I would use internal style sheet, having it's value set dynamically. This would go into your template file (maybe in head, after you have loaded your normal css): <style> #article em { background-color: <?php echo $page->parent->category_color ?>; } </style> Link to comment Share on other sites More sharing options...
Lars282 Posted March 12, 2012 Author Share Posted March 12, 2012 Thanks! I think I will do that. Though what could I do if I want to be able to use italic/bold/underline as well? Lars Link to comment Share on other sites More sharing options...
diogo Posted March 12, 2012 Share Posted March 12, 2012 Though what could I do if I want to be able to use italic/bold/underline as well? In this case, what you need is to create a custom button that will put <span class="custom"></span> around the content. I know it's possible to do it in tinyMCE, but I wonder if it's possible by using the additional tinyMCE setting on each field, so you don't have to mess around with the module. Link to comment Share on other sites More sharing options...
Lars282 Posted April 29, 2012 Author Share Posted April 29, 2012 Thanks diogo! Does anyone know how it is possible to do in the additional settings fields? Or do I have to try adding to the module? Lars Link to comment Share on other sites More sharing options...
ryan Posted April 30, 2012 Share Posted April 30, 2012 That additional settings field is where you can specify any additional TinyMCE settings that PW doesn't have dedicated config options for. These are the TinyMCE settings it's referring to: http://www.tinymce.com/wiki.php/Configuration So you could put this one one line in that additional settings field, as an example of specifying the theme_advanced_styles option in TinyMCE: theme_advanced_styles:Header 1=header1;Header 2=header2;Header 3=header3;Table Row=tableRow1 1 Link to comment Share on other sites More sharing options...
Lars282 Posted April 30, 2012 Author Share Posted April 30, 2012 Thanks ryan. In which of the tinyMCE settings field should I put this? Link to comment Share on other sites More sharing options...
ryan Posted April 30, 2012 Share Posted April 30, 2012 Edit any textarea field using TinyMCE. In the field editor, click the Input tab, then click 'TinyMCE Advanced Configuration Options'. Note the last field labeled 'Additional TinyMCE Settings'. Link to comment Share on other sites More sharing options...
Lars282 Posted April 30, 2012 Author Share Posted April 30, 2012 Hope this is not me being very stupid, but my last field is called 'valid_elements' ... ? Link to comment Share on other sites More sharing options...
diogo Posted April 30, 2012 Share Posted April 30, 2012 You don't have those last two fields after valid elements? Link to comment Share on other sites More sharing options...
Lars282 Posted April 30, 2012 Author Share Posted April 30, 2012 No! (see screenshot) But they would be quite useful to have ... ! I thought I had the latest version of PW ... Any idea how I can get them? Thanks, Lars Link to comment Share on other sites More sharing options...
Lars282 Posted April 30, 2012 Author Share Posted April 30, 2012 ryan, can you help? Link to comment Share on other sites More sharing options...
apeisa Posted May 1, 2012 Share Posted May 1, 2012 First make sure you do have latest version, pw gets minor updates all the time without getting new version numbers. Link to comment Share on other sites More sharing options...
ryan Posted May 2, 2012 Share Posted May 2, 2012 Lars282, apeisa is right -- it looks like you have a version that's a few months old. If you put in the latest, you should see the extra field because it was added recently. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now