Jump to content

Archived

This topic is now archived and is closed to further replies.

JawDesigns

Best ways to use Custom Code and CSS in DMS

Recommended Posts

JawDesigns

Hi to all,

 

I'm hoping for some advice on the best way to write CSS in DMS. Here are a few of the main problems I am experiencing:

 

1) The Custom Code Box is often too small. Am I able to undock the window inside another screen or tab?

 

2) When I inspect elements with the Custom Code window open it take's up most of my 15inch screen which seems like an awkward way to work to me.

 

3) The function 'Find' (cmd+f) doesn't seem to search the whole Custom Code window. This is annoying when I want to search '.mediabox' and it won't find any matches because '.mediabox' is located at the bottom of the Custom Code window.

 

If someone could please give me any extra tips on best ways/practices for working with DMS and CSS please let me know. It would be interesting to hear how others are working? 

 

Thanks for any advice on this,

 

Cheers,

 

James 

 


James Wilson

Designer & Photographer

 

Share this post


Link to post
Share on other sites
Rob

Hi James,

 

Candidly, our Custom Code area sometimes can be confusing because there are three vertical slides to manage. First, on the outer most right, you have the slide moving the site up and down within the browser, then, left of that, in the DMS edit area, you have the slide controlling the general area of the Custom Code section.  Lastly, if you have considerable custom code in the edit field, there's yet another slide to scroll through all that.   Very confusing.

 

Unfortunately, it cannot be undocked, though some have already requested that ability for the DMS edit area, generally, and I'm sure our developers are considering it.  Whether it will happen, I can't say. One trick some people use is to add the most recent CSS at the very top of the edit box.

 

I'd agree with you on point 2, that it's an odd way to work.  The edit field can take a considerable amount of space.  Luckily, once the code is published, you can click to shrink the edit area, giving you a better view.   Also helpful in the view is the ability to drag and drop the uppermost line of the division between the editing area of DMS and the website, downwards, improving the viewing area. Many don't know that by dragging the top most break line of the DMS toolbar down, you can expand the visible area of the site, or, conversely, improve the visible area of the Custom Code panel.

 

I realize No 3 on your list is very important.  I'm an old geezer, so I like to keep old school tools handy.  The way I do it is... copy the total Custom Code to a text file I can search, and save it.  Always keep your text file matching the code on your site.  That way, when you want to make changes, do it in the text file (easy to find things), and copy it, pasting it into the Custom Code area.  This has the added benefit for CSS3, of enabling you to validate your CSS at http://jigsaw.w3.org/css-validator/#validate_by_input (one of my secret tricks of the trade -- shhh!).

 

Hopefully, these will help!


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
Erwan

Hi jawdesigns

For the 3 very relevant reasons you mention (among other ones), I definitely prefer using the PageLines Customize Plugin (see: DMS doc / download link) and avoid the Custom Code area except for very few lines of CSS or LESS ;)

Did you give it a try with Rob old school ;) but so good tools?

My two cents!

Share this post


Link to post
Share on other sites
Rob

Good idea Erwan to use the Customize plugin, but comparably good to use a base child theme.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
JawDesigns

Thanks a lot to both Rob & Erwan for your advice on this! It's certainly helped me. I've been playing with a few methods mentioned above and at present I'm coping well with using both the Custom Code and Customize Plugin together. The Custom Code box obviously gives me instant changes in the browser (for small CSS adjustments) and the Customize Plugin gives me more space (and the 'find' feature works) so I'll probably continue with this method (using them both) for now as it seems to be giving me everything I need.

 

I also have the demo version of 'Sublime' but at present I don't think there's a need to use it with DMS and the Customize plug-in?

 

Thanks also to Erwan as I believe you wrote 'Customize Plugin'.

 

Cheers, J


James Wilson

Designer & Photographer

 

Share this post


Link to post
Share on other sites
Danny
You should use a code editor and imo Sublime text is the best one.

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Erwan

Hi jawdesigns,

I hope there's no confusion here: I of course didn't write/develop the plugin, it's Simon (PageLines dev team) ;)!

I just wrote a post (and recently updated it with comments) to explain why the plugin is useful: many reasons actually.

Including... with an active child theme customization, Rob ;)

And I of course agree with @Danny: Sublime Text is a must-have per se + with its numerous plugins like LESS syntax.

 

Share this post


Link to post
Share on other sites
JawDesigns

Thanks Erwan, I'll certainly take a look at your post. I've also been playing with Sublime as before I was writing all of my CSS directly inside the customize plugin inside Wordpress (plugins > edit > pagelines customize > css). This might seem obvious but I thought why not just open the pagelines customize CSS file directly from my FTP directly in Sublime? Maybe this would be an even better/easier way of working if a simple 'save' will overwrite the customize plugins css file (on my ftp) therefore allowing me to use all of the rich functionality of Sublime? Worth a go I suppose as I don't need to worry about overwriting the themes CSS file and I always make back-ups anyway. Sublime like Filezilla uses auto predict properties that you might want to apply/use (useful when you don't know every property like me at the moment).

 

Lots for me to look into and thanks to everyone for the help!

 

Thanks, James


James Wilson

Designer & Photographer

 

Share this post


Link to post
Share on other sites
Rob

You're very welcome, as always James!


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites

×