Advance inline styles mover

Created By

max fancourt

Description

Over the last few years I have been thinking about the inline styles that freeway produces and if there would be a way to moving these inline styles out of the html. The first thing that came along that started to address the issue was Weavers inline style actions plus Walters add selector and anonymous actions and recently Tim’s Externalise actions and Walters Classify all these actions are an absolute godsend but its a lot of individual actions and none of them address some issues which I needed to tackle on an everyday basis. Quite often I am ask to produce by our other members of the team (the asp.net gurus) to produce HTML pages that contains NO inline styles, the page must contain very few div id’s (ideally none) and for the styles to be on an external sheet.. oh and occasionally some of these divs need to have multiple classes. Now this is all possible with Freeway but it takes all of the above actions to do, it and it can be a bit of a nightmare when you have a massive form and you need to apply multiple actions to each item. plus one more thing.. actually getting to the secondary inline style which is produced for an image can be problematic… With all this in mind I started to look at the best way to combine the best of the above actions and try to add to the action where they were deficient so…..

This is a general description of what this actions does is

  1. it removes the div id if that function is chosen
  2. you can reapply a new div id or class name in its place
  3. if you don’t choose a name it will choose one for you
  4. you can then add extra classes to that div if you wish
  5. move the inline style back into the head again if you want
  6. sniff out any secondary tag like the image tag (img)
  7. add extra classes to that img tag and move any inline styles again back into the head
  8. finally it works with Tim plumbs externalise action so if that action is used then those head style will be moved to an external style sheet.

This action is for the advance freeway pro user only please don’t underestimate how quickly you can mess things up if you start to muck about with what freeway outputs This is probably the big caveat to this action…. it has the ability to manipulate the code output in a dramatic way and the downside is you can mess things up… the good thing about freeway is that to revert you just turn off the action and Freeway sorts it all back again

Things that I haven’t been able to tackle and this is mainly due to time restraints is it would be great if this action could add classes to other items like tables, paragraphs, form items etc… but at the moment I just don’t have time so if any one else wants to contribute then PLEASE PLEASE PLEASE feel free to have a go in making this action more than it is at the moment.

This actions comes with no instructions but if you apply it to a div and then start to look at the html output you will see quite quickly how much it manipulates the inline styles.

Special thanks must go to weaver which is were the backbone of the scripts came from and also Tim and Walter

Anyway for anyone who has been looking for an action like this please feel free to have a go and write to me with any comments….

1 Action in this project:

  Register or log in to add tags
FreewayCast

Learn by watching! Screencasts show you how to do it in Freeway. Visit FreewayCast today!