Newbie Question

Post anything about TopStyle here. NOTE: TopStyle has been discontinued.

Moderator: TopStyle Support

Post Reply
WinePaul
Rank 0 - Newcomer
Rank 0 - Newcomer
Posts: 3
Joined: Thu Aug 25, 2011 4:52 pm

Newbie Question

Post by WinePaul » Thu Aug 25, 2011 5:03 pm

I just started evaluating the trial version of Topstyle, and I'm not sure I'm using it exactly the right way. I want to clean up a bloated stylesheet, and strip out all of the inline styles I've been using and consolidate them into the stylesheet.

My issues so far:

My site (67wine.com) uses a series of linked include files. The stylesheet declarations are in the top level (main.asp) file, and does not have to be repeated in every include file. In Topstyle, is there any way to link these files to the proper stylesheet(s) without having the link inserted at the top of every file? Otherwise, I'm going to have to go back through every file and remove the link before it can be uploaded back to the site.

Is there an easy way to strip out the inline styles? I know I can use tidy to strip it into cdata, but is there a native way to do this in Topstyle?

Paul

User avatar
TopStyle Support
Rank VI - Professional
Rank VI - Professional
Posts: 507
Joined: Sat Jun 13, 2009 12:38 pm
Contact:

Re: Newbie Question

Post by TopStyle Support » Fri Aug 26, 2011 1:10 am

HTML > Convert Style Blocks exports all your <style> blocks to a new CSS document, and then replaces those <style> blocks with a <link> tag that references the newly created CSS document.

WinePaul
Rank 0 - Newcomer
Rank 0 - Newcomer
Posts: 3
Joined: Thu Aug 25, 2011 4:52 pm

Re: Newbie Question

Post by WinePaul » Fri Aug 26, 2011 12:46 pm

Let's start with the first question. Can I link the include files to the stylesheet in Topstyle, without having to put a link in the actual file?

User avatar
TopStyle Support
Rank VI - Professional
Rank VI - Professional
Posts: 507
Joined: Sat Jun 13, 2009 12:38 pm
Contact:

Re: Newbie Question

Post by TopStyle Support » Sat Aug 27, 2011 2:17 am

WinePaul wrote:Let's start with the first question. Can I link the include files to the stylesheet in Topstyle, without having to put a link in the actual file?
I'm not sure I understand the question. You can <link> from HTML documents to CSS documents, and TopStyle supports automating this task.

WinePaul
Rank 0 - Newcomer
Rank 0 - Newcomer
Posts: 3
Joined: Thu Aug 25, 2011 4:52 pm

Re: Newbie Question

Post by WinePaul » Mon Sep 12, 2011 2:06 pm

Thank you for your reply - sorry I got off the track for a while. I wear a bunch of different hats, and had to put this project aside for a while.

This is a simplification of my site structure:

Container
link:stylesheet
#include: Header
#include: image
#include: account menu
#include: top navigation
#include:main content
#include:left navigation
#include:right sidebar
#include:footer

Because the stylesheet is linked to (and loaded with) the container, I don't have to link every #include file to the stylesheet directly. The stylesheet is part of the final HTML file before any of the #includes.

For editing purposes in Topstyle, when I look at the account menu file, it doesn't see that the link is there. Of course not, you say, because there is no link in the account menu! Only humans know that the account menu is called from inside the container, which is always called first..

My question is whether there is a way to provide a virtual link to the stylesheet (in TopStyle only) without actually coding it. If I code it, then I would either have repeated server calls for the stylesheet, or I would have to take out the stylesheet link before I could upload the file.

User avatar
TopStyle Support
Rank VI - Professional
Rank VI - Professional
Posts: 507
Joined: Sat Jun 13, 2009 12:38 pm
Contact:

Re: Newbie Question

Post by TopStyle Support » Tue Sep 13, 2011 2:47 am

Hi Paul,

I assume you have opened the account menu HTML file (not the container). The account menu HTML file isn't linked to the style sheet, but while editing you would like to "virtually" link it to the style sheet (without actually inserting a <link> to the style sheet).

Here's how to accomplish this. First, you open the style sheet (not the account menu HTML file). Then you'll use the account menu HTML file as the "preview file" for the style sheet (there's a button labelled "customize preview files" for this in the upper-left corner of the preview panel).

Now that the style sheet has been opened in the editor panel and the HTML document has been opened in the preview panel, you can virtually "attach" the style sheet to the HTML document. In the upper-right corner of the preview panel, there's a button labelled "Preview Options". Click it. You should see a (sub) menu item named "Apply Style Sheet". Make sure this (sub) menu item has been checked.

Please let us know how this is working for you. Thanks!

Post Reply