what is Inspect element and how to use it?

You can use Inspect element and change each section for yourself. For more information, please read the following article.

Inspect element

If you want to make changes to design then you can use Inspect Tool to see the source code of your website and the CSS rules applied to it.
To enable it right click and from the pop-up menu select Inspect Element

For more details please visit Chrome inspect element or Firefox inspect element. Meanwhile searching on google for it will be helpful.

For example, we try to change bottom gray border color in a footer. You can watch the tutorial video here:

youtu.be/MWUP8uOLoaQ
CSS Tutorial: w3schools

Media Queries for All Devices

You can use “media query” for responsive mobile and tablet
https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

Put your CSS on custom screen size:

@media only screen and (max-width: 480px) {
    /* PUT YOUR CSS CODE */
}

or use between sizes:

@media (max-width: 960px) and (min-width: 481px){
    /* PUT YOUR CSS CODE */
}

Resource link: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

— Important Note: If you want to make sure that all your customizations are only being used in the Single Event page you need to use body classes like this screenshot

2 Comment
Avatar for Doris Cooper
Anna June 15, 2020
| |

Hello! I want to disable header and footer on pages of single events, or maybe change the default template of these pages. My theme doesn't provide this opportunity. How can I do it? Thanks!