Use a drop cap like on the blog IPB

[annadaa]

hi 

How to use a drop cap (initial) like on the blog IPB

I do not find

https://ckeditor.com/cke4/addons/plugins/all

 

thanks

 

[newbie LAC]

Hello,

This is the ::first-letter css pseudo-element.

[annadaa]

thanks and how can I use this feature easily when writing an article?

[newbie LAC]

Css

[data-pageapp="cms"][data-pagemodule="pages"][data-pagecontroller="page"] article [data-controller="core.front.core.lightboxedImages"] > p:first-child:first-letter {
    font-size: 60px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    line-height: 60px;
    float: left;
    margin-right: 5px;
    color: #963c8a;
}

[annadaa]

On 7/18/2019 at 1:27 PM, newbie LAC said:

Css

[data-pageapp="cms"][data-pagemodule="pages"][data-pagecontroller="page"] article [data-controller="core.front.core.lightboxedImages"] > p:first-child:first-letter {
    font-size: 60px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    line-height: 60px;
    float: left;
    margin-right: 5px;
    color: #963c8a;
}

can you tell me where I need to install this precisely so that it also works for the blog and article

and if the code changes also
 

thanks

[newbie LAC]

1 hour ago, annadaa said:

can you tell me where I need to install this precisely so that it also works for the blog and article

and if the code changes also

Add in custom.css

[data-pageapp="cms"][data-pagemodule="pages"][data-pagecontroller="page"] article [data-controller="core.front.core.lightboxedImages"] > p:first-child:first-letter,
[data-pageapp="blog"][data-pagemodule="blogs"][data-pagecontroller="entry"] article [data-controller="core.front.core.lightboxedImages"] > p:first-child:first-letter {
    font-size: 60px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: bold;
    line-height: 60px;
    float: left;
    margin-right: 5px;
    color: #963c8a;
}