I would like to set the charset on my xpage to utf-8. I tried to do this via the theme design element:
<resources>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
</resources>
but it gets completely ignored.
Other meta data settings like:
<metaData name="viewport" content="width=device-width, initial-scale=1.0" />
work fine.
I must have overlooked something?
Add the encoding specification through the xsp.properties file:
xsp.html.page.encoding=utf-8
And to the .theme file you are using add:
<resources>
<metaData>
<name>charset</name>
<content>utf-8</content>
</metaData>
...
Related
My meta tags for twitter in site:
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:site" content="....">
<meta property="twitter:title" content=".....">
<meta property="twitter:description" content="test description">
<meta property="twitter:image" content="....">
I even tried with twitter:image:url and also allowed twitter bot in robot.txt but no luck till now
Use name instead of property in you meta tags Like :
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="....">
<meta name="twitter:title" content=".....">
<meta name="twitter:description" content="test description">
<meta name="twitter:image" content="....">
May I know where did you test if the twitter card is working or not?
Did you check with https://cards-dev.twitter.com/validator?
Also, sometimes the placement of the meta tags do matter, place them early in the head section but after the og (open graph) meta-tags.
Let me know what error you get(if any) on the card validator.
If none of the above works, try changing twitter:image to twitter:image:src and make sure that the image fulfills the size requirements:
smallest size supported
summary: 144x144px
summary_large_image: 300x157px
Largest size supported
In both cases the maximum is 4096x4096px and at most 5MB.
Twitter share url
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:site" content="....">
<meta property="twitter:title" content=".....">
<meta property="twitter:description" content="test description">
<meta property="twitter:image" content="....">
Share Url : SHARE
It will work only on https
Twitter's card validator would return No meta tags found for me until I added the Content-Type: text/html header to the server's response.
From what I gather, Twitterbot doesn't even try to parse the page unless the server responds with the Content-Type it expects to see, which is text/html in this case.
I'm aware that I can create ordinary <meta> tags using my Xpages theme. By "ordinary" I mean <meta> tags consisting of a "name" and a "content" attribute as in
<meta name="author" content="me myself I">.
What I don't know is how I could create different types of meta tags like <meta http-equiv="expires" content="86400"> where we have a "http-equiv" attribute instead of a "name" one.
Any ideas anyone?
Just try this:
<theme>
<resources>
<metaData>
<httpEquiv>expires</httpEquiv>
<content>86400</content>
</metaData>
</resources>
</theme>
The generated HTML code looks like this:
<meta content="86400" http-equiv="expires">
I want to set the meta tag viewport in an XPage application. Therefore I use a theme which needs to extend the Bootstrap3.2.0_flat theme. As a result I get two viewport tags in the final html. But two viewport tags do not make any sense.
Theme:
<theme extends="Bootstrap3.2.0_flat" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="platform:/plugin/com.ibm.designer.domino.stylekits/schema/stylekit.xsd" >
<resources>
<metaData>
<name>viewport</name>
<content>user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi</content>
</metaData>
</resources>
</theme>
html:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi">
It seems the first viewport is derived form the theme. Is there any way to override it? Am thinking of mode="override" as used in controls. Or is the first viewport a result of something else?
With <control> properties in a theme you can use an override="true" attribute to specify that it should override the 'default' value. I don't think you can do that with a <metaData> tag.
What you can do however:
Create a new Bootstrap 3.2.0 base theme in your application that is based on the Bootstrap3.2.0_flat theme. The source for that can be found in the Extension Library.
In that theme you then set the correct value of the <metaData> tag.
In your current theme, you replace the extends="Bootstrap3.2.0_flat" with the name of your the theme you just created/ copied.
(oh and remember that in the latest Extension Library version, the Bootstrap3.2.0 theme has been renamed)
I really need help for this because when I write my code in source view, I have no problem but when I view it in design view it shows square instead of farsi characters.
how can I solve this problem?
There is no problem here:
make sure you have saved the final file with utf-8 with signature (file menu-> advanced save options)
add <meta charset="utf-8" /> to the head of the html page or your master page.
also you need these meta tags too: <meta http-equiv="Content-Language" content="fa" /> and <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
I have a page that Google Chrome insists on thinking is in French.
Here's a snapshot of it:
http://yootles.com/outbox/overcleverchrome.html
Note that I'm including a meta http-equiv tag to tell it that it's in fact in English:
<meta http-equiv="Content-language" content="en">
But it doesn't help.
Is there anything else I can do to prevent this?
Google Chrome currently requires several tags to make an (HTML5) document opt out of translation. Before doing this, you should be sure that you know your audience's language, as otherwise it will prevent foreign sites from properly translating your site.
The relevant tags are:
<meta charset="UTF-8" />
<meta name="google" content="notranslate" />
<meta http-equiv="Content-Language" content="en_US" />
And here is a full example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="google" content="notranslate" />
<meta http-equiv="Content-Language" content="en_US" />
</head>
<body>
Dies ist ein Test Deutsch
</body>
I found a post which might help you: http://www.blogsdna.com/4593/how-to-stop-google-from-translating-your-website-or-webpage.htm
You can either use a meta tag:
<meta name="google" value="notranslate">
Or you can use a class:
<span class="notranslate"></span>
I hope that answered your question.
EDIT: I Just checked my blog which I offer in German and English. On each language version Chrome doesn't ask me for translation: http://kau-boys.de
I checked my source code and the multilanguage plugin only included this code:
<meta http-equiv="Content-Language" content="en_US" />
So maybe your locale needs to have a subregion, like US in this example.
You guys should be referencing http://support.google.com/webmasters/bin/answer.py?hl=en&answer=79812 and not guessing what works
<meta name="google" content="notranslate" />
Adding <meta name="google" value="notranslate"> (not W3C by the way) or <meta name="google" content="notranslate"> doesn't avoid the annoying translate popups.
BUT I have tried the following and it seems to work:
You can avoid translation of the page by adding class="notranslate" to the <body> tag!
I have success with <meta name="google" content="notranslate" />
remember to open the page in a new tab or a new window after insert
<meta name="google" value="notranslate">
otherwise it looks not work, but it actually works well.
On an older version of Chrome (18.x), the Content-Language meta tag seems to have no effect on the translation popup, unless it is lowercased:
<meta http-equiv="content-language" content="en" />
(to be clear --http-equiv="Content-Language" did not work; neither did name="content-language")