function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Edwin VijayEdwin Vijay 

Changing doctype of a Visualforce Page

Hi All,

I have to use the following doctype in my visualforce page. How do i do this?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Thanks,
Edwin

Best Answer chosen by Admin (Salesforce Developers) 
looseneuronslooseneurons

This has been a great thread, but for me there were still a couple holes to fill in.

 

My finished page starts off like: 

 

<apex:page contentType="text/html" title="..." showHeader="false" sidebar="false">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

I did need to change the DOCTYPE as others have mentioned, but 'transitional' is OK for me, rather than 'strict'.

 

The change from the solution on this page for me was that non-IE browsers were fine with 'application/xhtml+xml', but IE tried to download the page rather than render it. The DOCTYPE does carry over if the contentType is 'text/html', though.

All Answers

dchasmandchasman
Unfortunately there is currently no support for changing the DOCTYPE of a visualforce page - you are the first person to ask for this so far. Please create a new Idea on the IdeaExchange to get this feature request into the hopper.
Edwin VijayEdwin Vijay
Thanks Doug,

Since it was possible in S-Control, i thought it would also be possible in VisualForce. Anyhow thanks for your response.

Regards,
Edwin
dchasmandchasman
Ah if you are just looking for that level of equivalence that is a different beast - assumed you meant something more sophisticated that would interact with the salesforce header/tabs/etc. You can do the equivalent of what you can do in an scontrol  (scontrol does not include headers, sidebars, footer etc in it) if turning off the header etc is acceptable for your use case.

The following will produce XHTML:

Code:
<apex:page showHeader="false" contentType="application/xhtml+xml">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <body>
        <h1>Hello {!$User.userName}</h1>
    </body>
</html>
</apex:page>

Something that is critical for you to understand is that salesforce.com generated markup is not guaranteed to be XHTML compliant and some VF components may produce content that is not valid under XHTML.

With that said more components than I expected do produce XHTML compliant content :-)



Message Edited by dchasman on 07-25-2008 08:05 AM
vanillamackvanillamack
Doug:

When I add:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

just below my <apex: page> tag, I get the following error appearing my debug logs:
A DOCTYPE is not allowed in content.

And it appears to be hosing the !action I am taking on the page. What to do?

According to this page, changing the DOCTYPE should be allowed...and it's a must for my formatting to look right. Using the loose dtd makes it look terrible.
dchasmandchasman
The styling page you referenced is from almost 3 years ago - long before Visualforce even existed. I do expect you will get a warning when you save a page like this one:

Code:
<apex:page showHeader="false" contentType="application/xhtml+xml">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <body>
        <h1>Hello {!$User.userName}</h1>
    </body>
</html>
</apex:page>

but I am not aware of any issue with regard to action methods etc. Like I said in my previous post your mileage may vary with xhtml - this is not something that salesforce.com is even close to supporting in our components and generated markup - same is true for the majority of the web.

Switching to xhtml has far reaching implications that will almost certainly impact a ton of things much more critical than styling.

Can you post your entire page definition to allow us to see if there is anything that can be done?
vanillamackvanillamack
Hmm. Looks like the content team needs to clean up old docs!

Putting this line in my page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Is an absolute must for formatting...If I leave it out, the loose dtd is applied and the page looks awful.

Although it does post a message in my debug logs saying that DOCTYPE is not allow, it is not hosing my Action as previously thought.

The inclusion of apex:inputField tags on the page was doing the hosing. As soon as a single inputField tag is put on the page, SF dumps all these extra stylesheets onto your page to handle the associated widgets if any. Those new CSS files create calculated styles by merging with my CSS and do the layout hosing.

I was forced to use apex:inputText boxes that were not bound to objects. In my controller Set methods, I basically did the object binding there.

All in the name of look n feel! :smileyvery-happy:

See you at DF!
Michael McLaughlin
Appirio
dchasmandchasman
One thing I am curious about is

vanillamack wrote:

I was forced to use apex:inputText boxes that were not bound to objects. In my controller Set methods, I basically did the object binding there.

apex:inputText can bind directly to anything (not true for apex:inputField) and I do not understand why you believe you need the extra level of indirection?
vanillamackvanillamack
Doug -
Yes, sorry I didn't provide enough detail.

For straight up text boxes, I bound to !object.field in the apex:inputText.

For select (single and multi) lists, I had to use apex:selectList and bind that to an intermediate variable that pumped the dropdown values in. Then, on Set, it pushed the selected value back into the desired object.field.
Cool_DevloperCool_Devloper

Hello Doug,

 

I am trying to do something on similar lines. Tried using the tags mentioned in the thread but no luck!

 

My requirement is that, i need to generate an XML out of my VF page. For this, i specified the "ContentType="application/xml" on my page header and then included the DOCTYPE tags to generate a standard XML out of it.

 

But somehow, i am not able to get the XML styling in the generated page and it shows me the shole page elements intead of just showing me the data.

 

Can you please let me know where i am going wrong or is this possible in VF? Pasting my VF page code below:

 

 

<apex:page cache="true" Controller="TestController" contentType="application/xml" showHeader="false">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html  xmlns="http://www.w3.org/1999/html" xml:lang="en" lang="en">
<body>
<apex:form >
<apex:pageblock id="exportDocs">
<apex:pageBlockTable value="{!exportValues}" var="actual">
<apex:column headerValue="Id" value="{!actual.Id}"/>
<apex:column headerValue="Act Name" value="{!actual.Name}"/>
<apex:column headerValue="MType" value="{!actual.A_Type__c}"/>
<apex:column headerValue="Country" value="{!actual.Country__c}"/>
<apex:column headerValue="B" value="{!actual.B__c}"/>
<apex:column headerValue="Actual C" value="{!actual.C__c}"/>
<apex:column headerValue="Actual G" value="{!actual.G__c}"/>
<apex:column headerValue="Actual I" value="{!actual.I__c}"/>
</apex:pageBlockTable>
</apex:pageblock>
</apex:form>
</body>
</html>
</apex:page>
 
Any help/guidance would be highly appreciated!!
 
Many Thanks,
Cool_D 
 
Message Edited by Cool_Devloper on  06-06-2009 09:18 AM


looseneuronslooseneurons
This has been a great thread, but for me there were still a couple holes to fill in.
 
My finished page starts off like: 
 
<apex:page contentType="text/html" title="..." showHeader="false" sidebar="false">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
I did need to change the DOCTYPE as others have mentioned, but 'transitional' is OK for me, rather than 'strict'.
 
The change from the solution on this page for me was that non-IE browsers were fine with 'application/xhtml+xml', but IE tried to download the page rather than render it. The DOCTYPE does carry over if the contentType is 'text/html', though.
This was selected as the best answer
Marty Y. ChangMarty Y. Chang
Hello, everyone,
 
I am having some difficulty saving a page with the !DOCTYPE tag in the latest Summer '10 release (API version 19.0).
 
I tried to start my page exactly as looseneurons wrote in his post, but I still get the same error: "A DOCTYPE is not allowed in content."
looseneurons wrote:
This has been a great thread, but for me there were still a couple holes to fill in.
 
My finished page starts off like: 
 
<apex:page contentType="text/html" title="..." showHeader="false" sidebar="false">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
I did need to change the DOCTYPE as others have mentioned, but 'transitional' is OK for me, rather than 'strict'.
 
The change from the solution on this page for me was that non-IE browsers were fine with 'application/xhtml+xml', but IE tried to download the page rather than render it. The DOCTYPE does carry over if the contentType is 'text/html', though.
 
Am I missing something really obvious here?  Can anyone confirm that they are able to save an API version 19.0 Visualforce page with the !DOCTYPE tag embedded somewhere in the page?
 
Marty...


kenfkenf
Marty,


 


I have just confirmed that my original solution does NOT work on a VF19 page. For now, if you do not need VF19, you can go back to API version 17 or 18 by going to Setup|Deveop|Pages and clicking "Edit" next to the page you want to move back. Then click "Version Settings" and change the Version number of the Salesforce.com API for the page. (Don't forget to save.)


 


That does not fix the issue for VF19 pages.


  • If you save with the DOCTYPE in place, you cannot even see your page to tweak it.
  • If you remove the DOCTYPE, the conditional styling &lt; and &gt; for IE versions is no longer escaped...
  •  

    • so the entities appear in the output stream at the top of your page.
    • but if you change them back to '<' and '>', the preprocessor strips them out of the HTML sent to the browser
    



 


Here is something to try... I noticed that conditional CSS that I included using <apex:include page="..."/> was carried through to the browser. Unfortunately, my included CSS pages are API version 17, so it is not a real test.


 


It does lead to a possible option for us though. If you need API 19, maybe you could use <apex:include page="..." /> to bring in conditional CSS from a page snippet that you force back to API 17 or 18.


 


If that works, we should amend this whole workaround to see if we can pull conditional browser support into an old-API include file and then forget about it in the rest of our pages. It would be a much more elegant solution than the one I started a year ago... and when we get to an API version that resolves our conflicts, it will be easy to strip it out later.


 


--k


richard.vanhookrichard.vanhook
In case someone wants to generate html5 content without any salesforce styling, this worked for me:
 
<apex:page standardStylesheets="false"
    sidebar="false"
    showHeader="false"
    contentType="text/html" cache="true"><apex:outputText escape="false" value="{!"<!DOCTYPE html>"}"/>
<html>
    <head>
        <title>test</title>
    </head>
    <body>test</body>
</html>
</apex:page>


kreshokresho
Great idea, just there are extra quotes that need escaping.
 
For xhtml I use <apex:outputText escape="false" value="{!'<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">'}"/> and it works with W12 (version 23)
 
Thanks,
Kresimir


b_o_o_mb_o_o_m
Use this : 
 
<apex:page showHeader="false" docType="html-5.0" standardStylesheets="false" cache="true">
  <html>
     <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     </head>
            <body>
            </body>
  </html>
</apex:page>


MohaMoha
your solution is :
<apex:page sidebar="false" docType="xhtml-1.0-transitional" showHeader="false" contentType="text/html" >
<html xmlns="http://www.w3.org/1999/xhtml">
i had the same problem earlier