
The 'p' and 'blockquote' from 'formatting' are working properly, but the other three styles don't do anything. The problem is, none of my custom formats are working. It's not Craft plugin - just extension of Redactor script itself. I have the 'h2' and 'h4' under 'formattingAdd' because I wanted them to use custom titles. To place youtube videos into redactor field, you need to enable redactor video plugin. youtube-playerĮmbedded youtube videos in redactor fields # That's why an embedded player will be wrapped with with class youtube-player - you can use CSS to give it proper max-width value - for example, 560px which is the value used by default embedded player. Each player with such CSS hack won't have a specific width and will fill up all available space. To fix it, we will use a bit of inlined CSS.
#Craft cms redactor show tag code
What's worse, default embedded player code generated by youtube website sets iframe width to a specific value and it won't fit inside a small screen of the phone. Responsive youtube players #Įmbedded players are placed in iframes and iframes by default are not responsive - they don't maintain aspect ratio when their width changes. Other browsers will ignore this feature - hopefully not for long. This functionality is available for Chrome since version 75 released in July 2019. Lazy loading in macros is handled by native lazy loading. Usually, each youtube player loads around 1,5 MB of data, even before the video starts playing - thanks to lazy loading we can save tons of bandwidth.
Thanks to lazy loading, iframes containing youtube embedded players will load their contents only when users actually see them. I will also talk about inserting youtube videos into redactor fields and youtube-related plugins. Macro making embedded players already existing in HTML responsive and lazy-loaded.Macro turning youtube video URLs into responsive and lazy-loaded embedded players.In this article, I will show you two macros: There are two ways in which embedded youtube players can be improved - they can be made responsive and lazy-loaded.

0 kommentar(er)