Templating HTML programmatically - visual-studio

In order to simply create templates for HTML pages (no PHP, no ASPX etc), I need the ability to build up HTML page-chunks that I could then assemble to form a complete HTML page.
So that when I need adding a new menu item, I can re-assemble all the pages with the changed menu-chunk.
I tried W3C's Amaya, and got it fatal error on 1st attempt! Yes, it's W3C and it's a bug pot lol.
Komposer's outdated version had a templating model, but not in the new version.
Since I can't find any "honest" open source website editor to do that, I think I will try this as a solution:
Use c# of VB .NET to build a database out of all HTML chunks.
Create very simplistic web pages with chunk names as comments, like:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>A title here</title>
</head>
<body>
<!-- menu_chunk12 -->
<!-- body1_chunk -->
<!-- footer3_chunk -->
</body>
</html>
When some chunk is edited, I just click a button and my little app will rebuild all the web pages and I'll re-publish them upload to the server.
What do you guru guys think about that?

This is not a terrible approach, but I would probably use some special notation in the comments like <!-- #include(chunk_name) --> so that these special comments are distinguished from regular comments.
You might also look at something like htp.

It's an interesting idea, but in my opinion, if you want a little more extensibility, look into doing XSLT tranformations into HTML. This would provide you a very homogeneous design, that would work on any platform serving HTML, and provide you with a complexity level you desire (simple or extreme).

Yes. I wrote a very simple but effective preprocesor for html that does this.
I used an extremely simple format where "##" was used to introduce a command. The most useful command was "##include " which caused another file's contents to be inserted in place of the include command.
Other useful commands would allow me to set variables, increment variables, and emit the value from a variable into the HTML output. These allow you to add things like a copyright date on all your pages and simply update it easily in a single ##included location.
It's a trivial program to write, and you have full power over the features.
I used this for about 10 years until I pretty much switched from html to php.

Related

How to make client's audio file download rather than play?

I would like visitors to be able to download my music files, rather than have those files automatically open in their browsers' players, but I don't know how.
I have read that HTML5's download attribute is made for this, but I can't get it to work.
My site's DTD is HTML 4.01 Strict -- would that be affecting it?
The relevant markup is:
<ul>
<li>Test.wav</li>
</ul>
How can I get the audio files to download instead of playing them directly in the browser?
UPDATE:
Some stackoverflow members are trying to educate me as to how this site works. They believe that one of my subsequent discoveries (posted below) isn't an answer to the above question. In my opinion it goes deeper than an answer, because it proved that my question wasn't valid. Here's what I wrote:
Thanks to Sql Surfer and Developer90 for your help.
It turns out that the problem was me: I hadn't realized that, in order for the HTML 5 "download" attribute to work, my files had to be online! I had been testing them via local files on my own desktop!
Once uploaded, "download" did everything it was supposed to do.
As I commented (above), testing showed me that "download" works in files that are HTML 5 doctype as well as those that are HTML 4.01 (strict) doctype.
My apologies for inconveniencing you!
It depends on the browser the user is. As you said, you can add the download attr in the <a></a> html tag like this:
<ul>
<li><a href="Test.wav" download="Test.wav" download>Test.wav</a></li>
</ul>
What you may can use is the target attr. But this is to open a new tab. Example:
<ul>
<li>Test.wav</li>
</ul>
It must be the html4 that is affecting it.
2 Ideas:
A: Keep html 4.01 and use javascript to affect the
"Content-disposition".
B: Use the <!DOCTYPE html> to force html 5
As Devloper90 points out the target tag is relevant. Having no target tag is probably what you want.

add text only version to an email template

We use mandrill to send emails and we have many templates defined to send emails. Below is one such template
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
----- some styling information ----
</style>
</head>
<body>
------ Other html content ------
</body>
</html>
As you can see there is no mention of text only version of this email template. To improve the chances of this email not going to spam i also want to add text only version of it as well. I got to know about "multipurpose internet mail extensions" but i still do not understand how i can make my email to have a text only version too.
I will be really grateful for any kind of help on this.
Strongly suggest using a templating service on top of Mandrill, such as apostle or sendwithus.
Makes it way easier to manage and edit html+text templates, and I believe both support your use case.
You didn't indicate anything about your environment, where you're storing the templates, or whether you're using Mandrill's SMTP integration or API. Those things can make a difference in how/where you store the text versions of your templates.
If you're generating the full SMTP message in some fashion in your system, then you'd need to create a multi-part/alternative MIME document to store the text version. Or use a library or templating engine that can generate this for you in accordance with the relevant specifications.
If you're storing them in your system, and using the Mandrill API, then you'd want to store a separate text version to pass in the text parameter.
For Mandrill templates, there's an explicit text version that can be provided and saved.
Alternately, Mandrill has an option to auto-convert your HTML to text. It can be configured in your Sending Defaults, or on a per-message basis through the API or with SMTP headers.

"Stray doctype" error in firefox source code viewer

Since I learned to serve XHTML pages as XML, I have started noticing something odd: whenever I view an XHTML page in the Firefox source code viewer, the DOCTYPE is always marked as an error. According to the tooltip I get from mousing over it, the error in question is a "stray doctype". From what I understand, a "stray doctype" means that there is an extra DOCTYPE in the middle of the document where it doesn&apos;t belong, which is certainly not the case here.
Here&apos;s an example - this markup will pass validation, and display correctly in all modern browsers:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--FF source viewer will mark the preceding two lines as an error.-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type"
content="application/xhtml+xml; charset=utf-8" />
<title>Sample XHTML Page</title>
</head>
<body>
<p>This is an example.</p>
</body>
</html>
This error message is especially odd, considering that these pages pass validation perfectly, and that a single parsing error would normally break the page.
I am the developer of this feature. You have found a bug. (Filed just now.) Thanks.
View Source syntax highlighting is based on the HTML parser, because our XML parser is not suited for the purpose and XML is rare enough that it doesn't make sense to put resources into implementing proper XML View Source. Hence, the XML View Source feature is a hack on the HTML parser and this aspect doesn't work quite right.
The error appears because the file is saved as UTF-8 BOM instead of UTF-8. Open the file in Notepad and change its encoding.
In addition to #Public Sphere's answer.
This warning can also occur when using <!DOCTYPE html>.
Probably the same warning is then also shown for the <html>, <head> and <body> tags (stray start tag "html").
To check if UTF-8 BOM is the problem:
Click the 'network' tab
Click the first request
On right details panel, click 'Response' tab and expand 'Response Payload'
You'll see the raw response now.
A red dot is in front of the doctype line,
and on hover it displays "\ufeff"
To easily find the files that could cause the problem, you can, in Linux, use this grep to find all files with BOM:
grep -rl $'\xEF\xBB\xBF' .

Can I make my ajax website 'crawlable'?

I'm currently building a music based website and I want to build something like this template. It uses ajax and deep linking. (And it makes use of the History.js library - please notice how there's no '#' in the URLs.)
The reason I want to use these 'ajaxy' methods (or maybe use the template altogether) is so that when music is playing, it will remain un-interrupted as the user navigates the site.
My worry is that my site wont be crawlable by Google but I think I can modify code in the page source to fix that. If I look at the source code to the template, in the head I see
<meta name="description" content="">
<meta name="author" content="">
<meta name="keywords" content="">
Now if I add this to the head:
<meta name="fragment" content="!">
will that make the site crawlable? Is there other code I need to add on top of this? Or is it just not possible for this template?
I'm following this guide https://developers.google.com/webmasters/ajax-crawling/docs/getting-started, and I'm on step 3. I will of course have to complete the other steps but I don't know I'm heading in the right direction, or heading towards a dead end!
Any help would be very much appreciated. Many thanks in advance.
From what you said it sounds like your site updates the address bar with clean urls as you navigate via ajax. That's good. The next thing is you want to do is make sure those urls work. If you directly go to a url do you see the specific content it represents. And would a crawler also see the correct content without running javascript. Progressive enhancement works well for that. The final thing is you want to do is make sure bots can pick up those urls.
I've not played with the meta tag for ! But it looks like it is only for the home page and you still need to implement the escaped fragment page. Maybe it does support other pages but the article does not cover that.

How to avoid hard linking Frontend assets In Spring MVC

I am new to spring MVC coming with experience using PHP MVC frameworks and ROR. I am having a hard time finding the appropriate way to organize and include front end assets into the view templates.
Here is the default code Roo produces for the default style sheet:
<spring:theme code="styleSheet" var="roo_css"/>
<spring:url value="/${roo_css}" var="roo_css_url"/>
<spring:url value="/static/images/favicon.ico" var="favicon" />
<link rel="stylesheet" type="text/css" media="screen" href="${roo_css_url}"></link>
This seems totally unnecessary to me. We are calling a variable from the spring:theme code list. Assigning it to a variable in the view scope/ and then calling that view variable for the
Ideally I would like to have some path tokens like: ${imagePage}, ${stylePath}, etc. That we could drop in and use for soft linking.
Hopefully somebody can point me to some quality SpringMVC documentation or give some examples. Thanks
Update:
I have seen a few examples and engfer has posted one below that suggest using the spring tags within the html to ouput the href like so
About
This would be acceptable however I am getting the following error from jetty
Caused by: org.apache.jasper.JasperException: /WEB-INF/views/footer.jspx(6,22) The value of attribute "href" associated with an element type "null" must not contain the '<' character.
Am I missing something with the encoding? or DTD?
Update:
So apparently the in-line href style only works with .jsp files as .jspx (What im using) is strict xml. What are the benefits of .jspx over .jsp and
The code you have provided from Roo is a little unnecessary. If you look at the Spring MVC documentation as tkeE2036 pointed out... you will see the themes section http://static.springsource.org/spring/docs/3.0.x/spring-framework-reference/html/mvc.html#mvc-themeresolver
<link rel="stylesheet" href="<spring:theme code='styleSheet'/>" type="text/css"/>
The Spring theme tag gives you the ability to internationalize your CSS/images/js (imagine an image that has the word 'Hello' which needs to be changed for English/Spanish/etc) into separate internationalized theme files that follow the http://java.sun.com/javase/6/docs/api/java/util/ResourceBundle.html convention and Spring will automatically resolve the correct resource bundled theme.
If you still want your ${imagePath} or whatever, you can use the <spring:url/> tag to get your job done.
<spring:url value="/images" var="imagePath"/>
<link rel="stylesheet" href="${imagePath}/foo.png" type="text/css"/>

Resources