Loading...
Skip navigation

Styling the AMP view

Styling the AMP view works just like normal HTML pages which are styled by using CSS. The AMP-Extension comes with a small Static-Template, which contains some basic styles. To use it just include the Static-Template.

Static-Template styles are contained in a TypoScript-Node:

plugin.tx_amp {
    settings {
        stylesheets.basic (

            body {
                background-color: white;
                padding: 15px;
            }
            /* ..more styles.. */
        )
    }
}

To add additional styles for a specific AMP view, you need to add them to the additionalTypoScript node as follows:

plugin.tx_amp {
    settings {
        stylesheets.additional (

            /* Specific styles for the EXT:openimmo */
            body {
                background-color: red;
            }
            /* ..more styles.. */
        )
    }
}

Internally the AMP-Extension merges stylesheets.basic and stylesheets.additional and compresses it, so that it fits well into the AMP view.

Warning:

AMP doesn't allow all styles! More information on: https://www.ampproject.org/docs/guides/responsive/style_pages

Contact request

You can contact us at any time

Stop! Playing in the meantime?
Stop! Playing in the meantime?
Stop! Playing in the meantime?

Stop! Playing in the meantime?

Break the highscore

Press Start
Contact request
Screenreader label
Security question
B27_________38T______
N_K____3____Q_____J51
DRI___HIL___T64______
__S____L______5___5M7
YXY_________FWT______