Webfont embedding on imported layouts

[soleum]

Good Morning!

I did not see any recent posts in regards to this, but I need a little assistance with webfonts, please! I'm just coming over from IJ/LJ, and I've imported flexible squares from the livejournal layout I was using.

Here is the css file I made for the fonts I currently use on my IJ. I'd like to use Nanum Gothic for my body fonts, and the other fonts for my subject lines and sidebar texts.

I know, I should learn about DW customization and its cores and all that. I probably will eventually, but for now I'd really like to continue using this layout with my own fonts (if possible!)

Honestly, if I could live with nothing but S1 Generator layouts for the rest of eternity, I would. Maybe it's a sign that I'm getting old, lmao. (On that note, if you guys know of any DW layouts out there that are comparable...please let me know!)

Comments

[momijizukamori]

You *should* be able to use @font-face declarations in your CSS - are they getting stripped out somewhere? I see three different embedded webfonts on your current DW layout, all from dropbox.

[soleum]

Yeah, I originally was using that method of using fonts up until dropbox took away our public folders. I have to take them out, since they're not valid anymore...

To remedy that issue on my other blog, I was linking in fonts with an external css file.
This is what I use in my CSS (minus the asterisks):

<*link rel="stylesheet" href="https://arashic.neocities.org/fonts.css"*>

This works on insanejournal to link my fonts in just fine, but on DW, it kills the layout (I have tested on this 'core 1' flexible squares, and a different 'core 2' layout)

For DW I think, perhaps, I need to be doing something on the actual base layer, too?

[momijizukamori]

Oh, I bet it's because IJ still uses S1, and we only have S2 - I'm gonna guess the functions that check the CSS for bad code are either choking on the link element or escaping it in a way that causes it to mess up the layout rendering. Can you try copying the entire contents of the external CSS file and putting them in your main one?

[soleum]

Oh, yes! I tried that and ended up with the same result. The way I'm liking the stylesheet is good, I've spot checked it on regular webpages before. I'm starting to think that perhaps DW either 1.) doesn't like base64 encoded fonts/doesn't support or 2.) requires them to be integrated in a different fashion that I've not figured out yet! lol

[momijizukamori]

It might be stripping it out, yeah, You can try embedding it straight in the layout layer you're using - something in Page::Print there should be a section with the head tags. I'd put the link html right after the opening or right before the close (inside the quote marks surrounding the HTML). If that doesn't work, you may have to find a place to host them rather than embedding them directly as base64 encodes :\

[baggyeyes]

Since you're writing a CSS sheet,
maybe try an @import? Example:

@import url('https://fonts.googleapis.com/css?family=Roboto');


I don't know if this will help. I've been away from CSS and HTML stuff for a while.

[baggyeyes]

Also, right at the bottom of the Customization/Font page, you can add the URL

http://www.dreamwidth.org/customize/options?group=fonts

[marahmarie]

This is what I do, though it also works if I embed the HTML link to it in my theme layer (which I no longer do because that just creates a separate style sheet on DW with the same CSS - if I want to change the fonts around it's easier to keep it all together).