Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

AMP page reference for external css

Tags:

html

css

amp-html

How can I add external css styles in amp page. This tag I am using to include css file.

<link href="css/cssnew.css" rel="stylesheet" media="screen">

Its giving the following error: The attribute 'href' in tag 'link rel=stylesheet for fonts' is set to the invalid value 'css/cssnew.css'. (see https://www.ampproject.org/docs/reference/spec#custom-fonts)

In amp documentation it specifies to use inline styling.

<style amp-custom>
//css code
</style>

But how to include all the required css inside this tag since it has certain limits. Can anybody explain me regarding this with an example as I am completely new to amp pages. Thank you in advance

like image 448
Deekshith Banjan Avatar asked Jun 13 '26 21:06

Deekshith Banjan


2 Answers

By using PHP you can do that but css should not exceed 50kb. You have to include this line in the head section

<?php readfile( getcwd() . "/amp.css"); ?>

CSS:

<style amp-custom>
    body {
        background-color: blue;
    }
</style>
like image 162
Bijesh Samani Avatar answered Jun 18 '26 01:06

Bijesh Samani


It is not possible to add external style sheets, like css. It needs addional network request, so it slows down loading the site.
See the Basic howto.

like image 37
Lovntola Avatar answered Jun 18 '26 00:06

Lovntola



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!