href attribute in a txp:css tag?

thijs · 2012-04-17 10:43:24

hi everybody,
nice to be here. i’m new to textpattern, switching over from wordpress development, in seach of something else and hopefully better. I like what i see in textpattern thus far, after having heard it mentioned a lot. I am currently trying to build a basic image portfolio-site, to see if I can build one that’s nicer and faster than my current wordpress-based site.

I have run into the following problem, trying to add a css-link to a google-font (Glegoo)… for this i need a css link element with an href attribute. As far as i can see, the txp:css does not output a href attribute.

I have come so far as to put the content of the link into a new style called glegoo, and calling that style with

<txp:css format=“link” name=“glegoo”/>

but adding href=“http://fonts.googleapis.com/css?family=Glegoo” to this gives an error.

Is there another tag that can do the same, or am I missing something?

Would appreciate any help.

Bloke · 2012-04-17 10:49:11

Hi thijs and welcome,

You’re not missing anything at all in this regard. The txp:css tag is only used for outputting standard stylesheets from the Presentation->Styles panel in the admin interface. If you want to link to a Google Font, or other type of link for that matter, then just embed it manually in your Page or Form:

<link href="http://fonts.googleapis.com/css?family=WhateverFont" rel="stylesheet" type="text/css">

Hope that helps.

Last edited by Bloke (2012-04-17 10:50:08)

thijs · 2012-04-17 10:53:58

thanks for the speedy answer!

I tried that first, but because the link contains a snippet of css, it doesn’t seem to work. When I load the frontpage, it spits out this snippet.

The full link would have to be:
<link type=“text/css” rel=“stylesheet” href=“http://fonts.googleapis.com/css?family=Glegoo”>
@font-face {
font-family: ‘Glegoo’;
font-style: normal;
font-weight: 400;
src: local(‘Glegoo’), local(‘Glegoo-Regular’), url(‘http://themes.googleusercontent.com/static/fonts/glegoo/v1/HlaektNAGXsvMSzJmADIXOvvDin1pK8aKteLpeZ5c0A.woff’) format(‘woff’);
}
</link>

You can see it happening here: http://dev.thijsvissia.nl

thanks for the help.

Bloke · 2012-04-17 11:03:43

Hmmm, I don’t know about that format. Didn’t know the link tag could take container content.

Google’s API for that font indicates you just use the <link> tag and then regular CSS rules after that. If you need to embed that font-face into your document doesn’t it need to be inside <style> tags, because it’s a CSS rule? (correct me if I’m wrong here: CSS isn’t my strong point).

In which case, you could put the font-face rule and any other style info into a regular Textpattern Stylesheet — I’d suggest your default sheet. Then you can include it into your Page template like this:

<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Glegoo">
<txp:css />

The first line embeds the code necessary for the Google font to work, the second line grabs the Stylesheet assigned to the current Textpattern Section that you are viewing — in the case of your home page it’s the first one mentioned in the Sections tab under the ‘Default’ entry.

I think that should do what you want.

Last edited by Bloke (2012-04-17 11:05:42)

thijs · 2012-04-17 11:11:01

ah yes that makes sense… it doesn’t need to be in there.

I guess I’m a bit disoriented, that I didn’t think of that. :)

Textpattern CMS

Textpattern CMS support forum

#1 2012-04-17 10:43:24

href attribute in a txp:css tag?

#2 2012-04-17 10:49:11

Re: href attribute in a txp:css tag?

#3 2012-04-17 10:53:58

Re: href attribute in a txp:css tag?

#4 2012-04-17 11:03:43

Re: href attribute in a txp:css tag?

#5 2012-04-17 11:11:01

Re: href attribute in a txp:css tag?

Board footer