Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Archive

Our old forums are still available as a read-only archive.

Moderators: martimiz, Sean, biapar, Willr, Ingo, simon_w

outline


Reply

7 Posts   1386 Views

Avatar
Nicolaas

14 May 2007 at 4:48pm Forum Moderator, 213 Posts

Hi Folk

I am just building my first site and one thing that really pisses me off is that the outline of the html is a bit messy. I like my outline to be precise so that I can visually see immediately what is going on

<div>
<ul>
<li>
etc....

Are there any tricks to get this sorted?

Avatar
Sean

14 May 2007 at 6:27pm Forum Moderator, 921 Posts

Are you meaning the HTML Source Editor for the CMS editor box?

Cheers,
Sean

Avatar
Willr

14 May 2007 at 6:30pm (Last edited: 14 May 2007 6:45pm), Forum Moderator, 5511 Posts

do you mean indentation? - http://en.wikipedia.org/wiki/Indent_style eg I use something like.

div
-tab-- ul
--2 tabs---- li
--2 tabs---- li
-tab-- /ul
/div

EDIT: ah forum doesnt like indentation. And Sean posted a second quicker then me! yeah I have noticed TinyMCE outputs shit in its html editor.. I would perhaps just copy the code from there into a HTML formatter (trying to find a link) and then copy it back...

Avatar
Sean

14 May 2007 at 6:57pm (Last edited: 14 May 2007 7:01pm), Forum Moderator, 921 Posts

It's difficult, if not impossible to make the code in the source editor look 'nice' as well as it being editable. Otherwise we'd be making an inline HTML editor like TextMate on the web. :-)

Here's a parser to tidy up the HTML;

http://infohound.net/tidy/

I've used this before with badly formed HTML inside the WYSIWYG editors, it does a fairly good job at cleaning up the mess TinyMCE cannot handle.

Also, in terms of the forum - we've already developed some ways of inserting styles in these forum posts like my bold text and [link]www.google.com[/link], similar to BB code. We're in the process of testing. This means you can put some snippets of PHP or HTML in these posts with syntax highlighting and actual tabbing. :-)

Cheers,
Sean

Avatar
Nicolaas

14 May 2007 at 9:40pm Forum Moderator, 213 Posts

Hey Dudes

Sorry, what I meant is for my actual published website. The one that I have just created and it would be easier to work with the css if saw the outline (indentation) in a logical way.

My template page is outlined (indented) correctly, for example:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<% base_tag %>
$MetaTags
<link rel="stylesheet" type="text/css" href="$project/css/style.css" />   
<link rel="stylesheet" type="text/css" href="$project/css/typography.css" />
</head>
<body>

the base tag and the meta tag may not be in the right place. it would be nice if the indentation was perfectly clean. I know that this would probably be a real luxury, but if you suffer from OCD then it is a bit of a must have ;-)

Nicolaas

Avatar
Ingo

15 May 2007 at 8:42am (Last edited: 15 May 2007 8:44am), Forum Moderator, 801 Posts

as sean mentioned, thats what you use tidy for (php-integration at: http://www.php.net/tidy)...
for complex sites, its just too much hassle to keep track of the indentation-level across multiple nested templates.
for simple sites: make sure that you don't have any whitespace between template-commands and the following html (ugly, but keeps indentation correct).
or even easier: use a proper source-viewer in your browser ;) install firefox web deveoper toolbar, firebug and the "source chart"-plugin

Avatar
Nicolaas

15 May 2007 at 10:07am Forum Moderator, 213 Posts

Hi Ingo

I am familiar with the solutions you mention, but is there an easy way to add it to my SS development? I am completely new to SS and I was wondering if you could just add a command or something that would clean up the html.

Thank you

Nicolaas