HTML is a markup language For web pages. In fact, HTML stands for HyperText Markup Language.
One thing that needs to be made clear right away and kept in mind is that theHTML is not a programming language: HTML is only for format text and to layout elements such as forms, quotes, videos.
In this brief guide we will not dwell too much on technical or philosophical discussions of what is a hypertext, but we will take as our definition that of a web page, a navigable page on the Internet.
Tools
All you need to develop your first html page is a simple text editor, for Windows users the simple Notepad.
Our first HTML page
We open notepad and enter the following code:
<html></html>
We click save and choose a name "page.html" and from the drop-down menu "save as" let us remember to select "all files“.
At this point we have created our first html page, which when opened will show a blank page.
Each html page basically consists of two elements, a head <head> and a body <body>.
We modify our page in this way:
<html>
<head></head>
<body></body>
</html>
The DOCTYPE
At this point it is important to introduce the concept of DOCTYPE. The doctype is a declaration that is inserted at the beginning of the document that allows browsers to render the page correctly. In the case of HTML5 the doctype declaration is as follows:
<!doctype html>
<html>
<head></head>
<body></body>
</html>
In the past, longer and more articulate doctype statements were used, but now theHTML5 is a standard, so we will limit ourselves only to this one.
Adding a title to the HTML page: the title tag
If we try to open the previously created html page, we will see that the window bar will show the file path. If we want to add a more explanatory title, we can add the tag </strong> in the<strong><head></strong> Of the document.</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup line-numbers"><!doctype html>
<html>
<head>
<title>My first web page</title>
</head>
<body></body>
</html></code></pre>
<p>In addition to making the page more user-friendly, the presence of the title is also important on the side <strong>SEO</strong>.</p>
<h2 class="wp-block-heading" id="i-tag">Tags</h2>
<p>One of the first things we can notice is that HTML is a language composed of tags. Each HTML tag is always enclosed between a minor sign ( ). A generic tag is characterized by the following syntax: </p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup line-numbers"><nomedeltag></code></pre>
<p>Tags can provide an opening <strong><nometag></strong> and a closing <strong></nometag></strong>, </p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><h1>Article Title</h1></code></pre>
<p>or be tags that contain no elements so they are self-closing. An example of the latter type of tag is. <strong><img /></strong>.</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup line-numbers"><img src="mondo.jpg" /></code></pre>
<p>In this brief guide we will not analyze all html tags, but only the most frequently used ones. For an exhaustive list of all tags you can look at <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element" target="_blank" rel="noopener">here</a>.</p>
<p>Let's see what the main tags are and how to use them.</p>
<h2 class="wp-block-heading" id="il-tag-h1-e-gli-altri-headings">The tag <h1> and the other headings</h2>
<p>The tag <strong><h1></strong> is used to define a heading (title, header), which is text that has greater importance within the content of our html page, so it will be formatted with a larger font. </p>
<p>There are various header tags based on importance: therefore, you can have <strong><h1></strong>, <strong><h2></strong> , <<strong>h3></strong> , <strong><h4></strong> , <strong><h5></strong> , <strong><h6></strong>. </p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><h1>Page title</h1></code></pre>
<h2 class="wp-block-heading" id="il-tag-p">The tag <p></h2>
<p>The <<strong>p></strong> is used to define a paragraph. By inserting text within this tag, it will be formatted as free text. </p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><p>On this page we will discuss HTML.</p></code></pre>
<h2 class="wp-block-heading" id="il-tag-b">The tag <b></h2>
<p>The tag <strong><b></strong> Is used to highlight text:</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><b>very important text</b></code></pre>
<p>Its operation is identical to that of the tag <strong>, bold a portion of text.</p>
<h2 class="wp-block-heading" id="il-tag-a">The tag <a> </h2>
<p>The tag <a> is used to define a link (links between web pages) allows us to create a link from our page to another page. The syntax of a link is as follows: </p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><a href="https://www.google.it">Link to Google</a></code></pre>
<p>We can see that the tag <a> needs the href attribute indicating the destination page. </p>
<h2 class="wp-block-heading" id="il-tag-img">The tag <img></h2>
<p>The tag <strong><img></strong> is used to insert an image within the HTML page. Unlike the previous tags, the <img> is a self-closing tag, that is, it does not need a closing tag.</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><img src="immagini/terra.jpg" /></code></pre>
<p>As we see in the example, the tag <img> needs the src attribute, which indicates the path to the image to be displayed. The tag <img> Can also have other attributes:</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><img src="immagini/terra.jpg" alt="image of the Earth" /></code></pre>
<p>In this example, the alt attribute is used to display alternative text in case the image does not load. It is also useful for indicating to search engines what is displayed on the page, which is very important from an SEO perspective.</p>
<h2 class="wp-block-heading" id="i-tag-lista-ul-ol-li">The list tags <ul>, <ol>, <li>.</h2>
<p>If we want to show a list in our html page we can use the <ul> tag. This tag shows an unordered list, so a dot will appear at the side of each list item. In case we want to show a numbered list we can use the <ol> tag. </p>
<p>Each list item must be enclosed within the <li> tag.</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><ul>
<li>Primo punto</li>
<li>Secondo punto</li>
<li>Terzo punto</li>
</ul></code></pre>
<h2 class="wp-block-heading" id="mini-tutorial-come-creare-la-tua-prima-pagina-web">Mini tutorial: how to create your first web page</h2>
<p>After taking a quick look at the main html tags, we can try to create our first web page.</p>
<p>We open Notepad or any other text edtor and start typing this code inside:</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup"><!doctype html>
<html>
<head>
<title>My first web page</title>
</head>
<body></body>
</html></code></pre>
<figure data-wp-context="{"uploadedSrc":"https:\/\/www.francescopepe.com\/wp-content\/uploads\/2019\/07\/tutorial_html_02.png","figureClassNames":"wp-block-image","figureStyles":null,"imgClassNames":"wp-image-133","imgStyles":null,"targetWidth":600,"targetHeight":400,"scaleAttr":false,"ariaLabel":"Enlarge image: prima pagina html","alt":"prima pagina html"}" data-wp-interactive="core/image" class="wp-block-image wp-lightbox-container"><img decoding="async" width="600" height="400" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_02.png" alt="first page html" class="wp-image-133" title="HTML beginner's guide: tags and formatting of text and images 2" srcset="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_02.png 600w, https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_02-300x200.png 300w" sizes="(max-width: 600px) 100vw, 600px" /><button
class="lightbox-trigger"
type="button"
aria-haspopup="dialog"
aria-label="Enlarge image: first page html"
data-wp-init="callbacks.initTriggerButton"
data-wp-on-async--click="actions.showLightbox"
data-wp-style--right="context.imageButtonRight"
data-wp-style--top="context.imageButtonTop"
>
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewbox="0 0 12 12">
<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
</svg>
</button></figure>
<p>Save as and remember to select "All files" in the drop-down box, after which we save as <strong>index.html</strong> o <strong>mypage.html</strong> Or whatever we like best. </p>
<figure data-wp-context="{"uploadedSrc":"https:\/\/www.francescopepe.com\/wp-content\/uploads\/2019\/07\/tutorial_html_02-1.png","figureClassNames":"wp-block-image","figureStyles":null,"imgClassNames":"wp-image-135","imgStyles":null,"targetWidth":960,"targetHeight":540,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""}" data-wp-interactive="core/image" class="wp-block-image wp-lightbox-container"><img loading="lazy" decoding="async" width="960" height="540" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_02-1.png" alt="HTML beginner's guide: tags and formatting of text and images 1" class="wp-image-135" title="HTML beginner's guide: tags and formatting of text and images 3" srcset="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_02-1.png 960w, https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_02-1-300x169.png 300w, https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_02-1-768x432.png 768w" sizes="(max-width: 960px) 100vw, 960px" /><button
class="lightbox-trigger"
type="button"
aria-haspopup="dialog"
aria-label="Enlarge image"
data-wp-init="callbacks.initTriggerButton"
data-wp-on-async--click="actions.showLightbox"
data-wp-style--right="context.imageButtonRight"
data-wp-style--top="context.imageButtonTop"
>
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewbox="0 0 12 12">
<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
</svg>
</button></figure>
<p>If we double-click on the file we just saved, a new browser window will open with our first html page. It will be a blank page, but it will have the title we entered in the tag <strong><title></strong>.</p>
<figure data-wp-context="{"uploadedSrc":"https:\/\/www.francescopepe.com\/wp-content\/uploads\/2019\/07\/tutorial_html_03.png","figureClassNames":"wp-block-image","figureStyles":null,"imgClassNames":"wp-image-136","imgStyles":null,"targetWidth":650,"targetHeight":133,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""}" data-wp-interactive="core/image" class="wp-block-image wp-lightbox-container"><img loading="lazy" decoding="async" width="650" height="133" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_03.png" alt="HTML beginner's guide: tags and formatting of text and images 2" class="wp-image-136" title="HTML guide for beginners: tags and formatting of text and images 4" srcset="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_03.png 650w, https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_03-300x61.png 300w" sizes="(max-width: 650px) 100vw, 650px" /><button
class="lightbox-trigger"
type="button"
aria-haspopup="dialog"
aria-label="Enlarge image"
data-wp-init="callbacks.initTriggerButton"
data-wp-on-async--click="actions.showLightbox"
data-wp-style--right="context.imageButtonRight"
data-wp-style--top="context.imageButtonTop"
>
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewbox="0 0 12 12">
<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
</svg>
</button></figure>
<p>Let's go ahead and build the web page. Let's add a header and a few paragraphs. Let's apply the tag <strong><b></strong> to a few words to highlight, such as the name of the city of Birth, add a photo with the tag <strong><img></strong> and a link to the page on Wikipedia.</p>
<pre class="wp-block-code" data-no-auto-translation=""><code lang="markup" class="language-markup line-numbers"><!doctype html>
<html>
<head>
<title>My first web page</title>
</head>
<body>
<h1>Lionel Messi</h1>
<p>Lionel Andrés Messi, called simply Leo by many, was born on June 24, 1987 in <b>Rosario</b>, in the Argentine state of Santa Fe.
</p>
<img src="Messi.jpg" />
<p>He is only five years old when he starts kicking the ball for the first time. His first team is the <b>Grandoli</b>, a small soccer school in his town aimed at children. Coaching the boys is Jorge Messi, a metalworker employee and father of the future champion.
</p>
<p>At the age of seven <a href="https://it.wikipedia.org/wiki/Lionel_Messi">Lionel Messi</a> he wears the jersey of "Newell's Old Boys" and plays in the youth categories. To the eyes of the soccer fans who followed the young boy in the small fields of Rosario, the talent of the youngster was already clear.
</p>
<h2>The arrival in barcelona</h2>
<p>Because of a delay in the boy's bone development due to low levels of growth hormones in his body, the transition fades.
</p>
<p>Medical treatment is recommended to the family, but it is very expensive: it is reported to be $900 monthly; Jorge Messi asks for help from Newell's Old Boys and River Plate without getting adequate solutions. He strongly believes in Lionel's possible future as a champion: so he asks some foundations for help.
</p>
</body>
</html></code></pre>
<p>If we want to insert an image, we can save it in the same folder as the html file and retrieve it by entering the file name in the attribute <strong>src</strong> of the tag <strong><img></strong>.</p>
<p>If we have done everything correctly, we should get something like this:</p>
<figure data-wp-context="{"uploadedSrc":"https:\/\/www.francescopepe.com\/wp-content\/uploads\/2019\/07\/tutorial_html_04.png","figureClassNames":"wp-block-image","figureStyles":null,"imgClassNames":"wp-image-146","imgStyles":null,"targetWidth":902,"targetHeight":654,"scaleAttr":false,"ariaLabel":"Enlarge image","alt":""}" data-wp-interactive="core/image" class="wp-block-image wp-lightbox-container"><img loading="lazy" decoding="async" width="902" height="654" data-wp-init="callbacks.setButtonStyles" data-wp-on-async--click="actions.showLightbox" data-wp-on-async--load="callbacks.setButtonStyles" data-wp-on-async-window--resize="callbacks.setButtonStyles" src="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_04.png" alt="HTML beginner's guide: tags and formatting of text and images 3" class="wp-image-146" title="HTML beginner's guide: tags and formatting of text and images 5" srcset="https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_04.png 902w, https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_04-300x218.png 300w, https://www.francescopepe.com/wp-content/uploads/2019/07/tutorial_html_04-768x557.png 768w" sizes="(max-width: 902px) 100vw, 902px" /><button
class="lightbox-trigger"
type="button"
aria-haspopup="dialog"
aria-label="Enlarge image"
data-wp-init="callbacks.initTriggerButton"
data-wp-on-async--click="actions.showLightbox"
data-wp-style--right="context.imageButtonRight"
data-wp-style--top="context.imageButtonTop"
>
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewbox="0 0 12 12">
<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
</svg>
</button></figure>
<p>In this brief guide on HTML we have seen how to make a web page, add text and images, format a header and bold text, and add links. </p>
<p>To improve our page we will need to change its appearance, using the <strong>CSS</strong>. This will be the subject of a future guide.</p>
</div>
<div class="wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained">
<div class="wp-block-group post-meta has-small-font-size is-content-justification-space-between is-layout-flex wp-container-core-group-is-layout-5 wp-block-group-is-layout-flex" style="border-radius:5px;margin-top:var(--wp--preset--spacing--large)"></div>
</div>
</main>
<div class="wp-block-comments alignfull wp-block-comments-query-loop has-tertiary-background-color has-background" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--x-large);padding-right:var(--wp--preset--spacing--medium);padding-bottom:var(--wp--preset--spacing--x-large);padding-left:var(--wp--preset--spacing--medium)">
<div class="wp-block-group has-global-padding is-layout-constrained wp-container-core-group-is-layout-10 wp-block-group-is-layout-constrained" style="padding-right:0;padding-left:0">
<div class="wp-block-group has-global-padding is-layout-constrained wp-container-core-group-is-layout-8 wp-block-group-is-layout-constrained">
<h2 class="wp-block-heading">Comments</h2>
</div>
<div class="wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained"></div>
<div id="respond" class="comment-respond wp-block-post-comments-form">
<h3 id="reply-title" class="comment-reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="/en/html-guide/#respond" style="display:none;">Cancel reply</a></small></h3><form action="https://www.francescopepe.com/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate data-trp-original-action="https://www.francescopepe.com/wp-comments-post.php"><p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> <span class="required-field-message">Required fields are marked <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Comment <span class="required">*</span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Name <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required /></p>
<p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required /></p>
<p class="comment-form-url"><label for="url">Website</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" autocomplete="url" /></p>
<p class="form-submit wp-block-button"><input name="submit" type="submit" id="submit" class="wp-block-button__link wp-element-button" value="Post Comment" /> <input type='hidden' name='comment_post_ID' value='1' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
</p><input type="hidden" name="trp-form-language" value="en"/></form> </div><!-- #respond -->
</div>
</div>
<div class="wp-block-group alignfull has-primary-background-color has-background has-global-padding is-layout-constrained wp-container-core-group-is-layout-14 wp-block-group-is-layout-constrained" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--x-large);padding-bottom:var(--wp--preset--spacing--x-large)">
<div class="wp-block-query alignwide is-layout-flow wp-block-query-is-layout-flow"><ul class="columns-3 wp-block-post-template has-large-font-size is-layout-grid wp-container-core-post-template-is-layout-1 wp-block-post-template-is-layout-grid"><li class="wp-block-post post-1084 post type-post status-publish format-standard has-post-thumbnail hentry category-guide">
<div class="wp-block-group is-vertical is-content-justification-left is-layout-flex wp-container-core-group-is-layout-11 wp-block-group-is-layout-flex"><div style="font-style:normal;font-weight:500" class="taxonomy-category has-link-color is-style-default wp-elements-a566851584f438afbd43d6c4573ab560 wp-block-post-terms has-text-color has-main-accent-color has-x-small-font-size"><a href="https://www.francescopepe.com/en/category/guides/" rel="tag">Guides</a></div>
<h2 style="font-style:normal;font-weight:600;text-decoration:none; margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;" class="has-link-color wp-elements-93a9775c2dc1ae17883d3f54ed88db4b wp-block-post-title has-base-font-size"><a href="https://www.francescopepe.com/en/how-to-submit-form-data-to-google-sheets/" target="_self" >How to Submit Form Data to Google Sheets: A Practical Guide</a></h2>
<div class="wp-block-post-date has-text-color has-main-accent-color has-x-small-font-size"><time datetime="2024-05-10T02:59:54+00:00">May 10, 2024</time></div></div>
</li><li class="wp-block-post post-316 post type-post status-publish format-standard has-post-thumbnail hentry category-seo">
<div class="wp-block-group is-vertical is-content-justification-left is-layout-flex wp-container-core-group-is-layout-12 wp-block-group-is-layout-flex"><div style="font-style:normal;font-weight:500" class="taxonomy-category has-link-color is-style-default wp-elements-a566851584f438afbd43d6c4573ab560 wp-block-post-terms has-text-color has-main-accent-color has-x-small-font-size"><a href="https://www.francescopepe.com/en/category/seo/" rel="tag">SEO</a></div>
<h2 style="font-style:normal;font-weight:600;text-decoration:none; margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;" class="has-link-color wp-elements-93a9775c2dc1ae17883d3f54ed88db4b wp-block-post-title has-base-font-size"><a href="https://www.francescopepe.com/en/how-to-increase-search-engine-visibility-through-faq-rich-snippet/" target="_self" >How to increase search engine visibility through FAQ rich snippet</a></h2>
<div class="wp-block-post-date has-text-color has-main-accent-color has-x-small-font-size"><time datetime="2023-08-02T17:09:00+00:00">August 2, 2023</time></div></div>
</li><li class="wp-block-post post-375 post type-post status-publish format-standard has-post-thumbnail hentry category-seo">
<div class="wp-block-group is-vertical is-content-justification-left is-layout-flex wp-container-core-group-is-layout-13 wp-block-group-is-layout-flex"><div style="font-style:normal;font-weight:500" class="taxonomy-category has-link-color is-style-default wp-elements-a566851584f438afbd43d6c4573ab560 wp-block-post-terms has-text-color has-main-accent-color has-x-small-font-size"><a href="https://www.francescopepe.com/en/category/seo/" rel="tag">SEO</a></div>
<h2 style="font-style:normal;font-weight:600;text-decoration:none; margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;" class="has-link-color wp-elements-93a9775c2dc1ae17883d3f54ed88db4b wp-block-post-title has-base-font-size"><a href="https://www.francescopepe.com/en/how-to-track-events-in-analytics/" target="_self" >How to track events in Google Analytics</a></h2>
<div class="wp-block-post-date has-text-color has-main-accent-color has-x-small-font-size"><time datetime="2019-08-05T15:32:46+00:00">August 5, 2019</time></div></div>
</li></ul></div>
</div>
<footer class="site-footer wp-block-template-part">
<div class="wp-block-group alignfull dark-footer has-base-color has-main-background-color has-text-color has-background has-link-color wp-elements-0f294aabf00e0760828c70e5013002a4 has-global-padding is-layout-constrained wp-container-core-group-is-layout-21 wp-block-group-is-layout-constrained" style="margin-top:0px;padding-top:var(--wp--preset--spacing--xx-large);padding-right:var(--wp--preset--spacing--medium);padding-bottom:var(--wp--preset--spacing--xx-large);padding-left:var(--wp--preset--spacing--medium)">
<div class="wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-2 wp-block-columns-is-layout-flex">
<div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow">
<p style="font-style:normal;font-weight:600">Francis Pepe</p>
<ul class="wp-block-social-links has-icon-color has-icon-background-color is-style-default is-content-justification-left is-layout-flex wp-container-core-social-links-is-layout-1 wp-block-social-links-is-layout-flex"><li style="color: #150E29; background-color: #fff; " class="wp-social-link wp-social-link-instagram has-main-color has-base-background-color wp-block-social-link"><a href="https://instagram.com/tropicalista_" class="wp-block-social-link-anchor"><svg width="24" height="24" viewbox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M12,4.622c2.403,0,2.688,0.009,3.637,0.052c0.877,0.04,1.354,0.187,1.671,0.31c0.42,0.163,0.72,0.358,1.035,0.673 c0.315,0.315,0.51,0.615,0.673,1.035c0.123,0.317,0.27,0.794,0.31,1.671c0.043,0.949,0.052,1.234,0.052,3.637 s-0.009,2.688-0.052,3.637c-0.04,0.877-0.187,1.354-0.31,1.671c-0.163,0.42-0.358,0.72-0.673,1.035 c-0.315,0.315-0.615,0.51-1.035,0.673c-0.317,0.123-0.794,0.27-1.671,0.31c-0.949,0.043-1.233,0.052-3.637,0.052 s-2.688-0.009-3.637-0.052c-0.877-0.04-1.354-0.187-1.671-0.31c-0.42-0.163-0.72-0.358-1.035-0.673 c-0.315-0.315-0.51-0.615-0.673-1.035c-0.123-0.317-0.27-0.794-0.31-1.671C4.631,14.688,4.622,14.403,4.622,12 s0.009-2.688,0.052-3.637c0.04-0.877,0.187-1.354,0.31-1.671c0.163-0.42,0.358-0.72,0.673-1.035 c0.315-0.315,0.615-0.51,1.035-0.673c0.317-0.123,0.794-0.27,1.671-0.31C9.312,4.631,9.597,4.622,12,4.622 M12,3 C9.556,3,9.249,3.01,8.289,3.054C7.331,3.098,6.677,3.25,6.105,3.472C5.513,3.702,5.011,4.01,4.511,4.511 c-0.5,0.5-0.808,1.002-1.038,1.594C3.25,6.677,3.098,7.331,3.054,8.289C3.01,9.249,3,9.556,3,12c0,2.444,0.01,2.751,0.054,3.711 c0.044,0.958,0.196,1.612,0.418,2.185c0.23,0.592,0.538,1.094,1.038,1.594c0.5,0.5,1.002,0.808,1.594,1.038 c0.572,0.222,1.227,0.375,2.185,0.418C9.249,20.99,9.556,21,12,21s2.751-0.01,3.711-0.054c0.958-0.044,1.612-0.196,2.185-0.418 c0.592-0.23,1.094-0.538,1.594-1.038c0.5-0.5,0.808-1.002,1.038-1.594c0.222-0.572,0.375-1.227,0.418-2.185 C20.99,14.751,21,14.444,21,12s-0.01-2.751-0.054-3.711c-0.044-0.958-0.196-1.612-0.418-2.185c-0.23-0.592-0.538-1.094-1.038-1.594 c-0.5-0.5-1.002-0.808-1.594-1.038c-0.572-0.222-1.227-0.375-2.185-0.418C14.751,3.01,14.444,3,12,3L12,3z M12,7.378 c-2.552,0-4.622,2.069-4.622,4.622S9.448,16.622,12,16.622s4.622-2.069,4.622-4.622S14.552,7.378,12,7.378z M12,15 c-1.657,0-3-1.343-3-3s1.343-3,3-3s3,1.343,3,3S13.657,15,12,15z M16.804,6.116c-0.596,0-1.08,0.484-1.08,1.08 s0.484,1.08,1.08,1.08c0.596,0,1.08-0.484,1.08-1.08S17.401,6.116,16.804,6.116z"></path></svg><span class="wp-block-social-link-label screen-reader-text">Instagram</span></a></li>
<li style="color: #150E29; background-color: #fff; " class="wp-social-link wp-social-link-facebook has-main-color has-base-background-color wp-block-social-link"><a href="https://facebook.com/tropicalista" class="wp-block-social-link-anchor"><svg width="24" height="24" viewbox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M12 2C6.5 2 2 6.5 2 12c0 5 3.7 9.1 8.4 9.9v-7H7.9V12h2.5V9.8c0-2.5 1.5-3.9 3.8-3.9 1.1 0 2.2.2 2.2.2v2.5h-1.3c-1.2 0-1.6.8-1.6 1.6V12h2.8l-.4 2.9h-2.3v7C18.3 21.1 22 17 22 12c0-5.5-4.5-10-10-10z"></path></svg><span class="wp-block-social-link-label screen-reader-text">Facebook</span></a></li>
<li style="color: #150E29; background-color: #fff; " class="wp-social-link wp-social-link-github has-main-color has-base-background-color wp-block-social-link"><a href="https://github.com/tropicalista" class="wp-block-social-link-anchor"><svg width="24" height="24" viewbox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M12,2C6.477,2,2,6.477,2,12c0,4.419,2.865,8.166,6.839,9.489c0.5,0.09,0.682-0.218,0.682-0.484 c0-0.236-0.009-0.866-0.014-1.699c-2.782,0.602-3.369-1.34-3.369-1.34c-0.455-1.157-1.11-1.465-1.11-1.465 c-0.909-0.62,0.069-0.608,0.069-0.608c1.004,0.071,1.532,1.03,1.532,1.03c0.891,1.529,2.341,1.089,2.91,0.833 c0.091-0.647,0.349-1.086,0.635-1.337c-2.22-0.251-4.555-1.111-4.555-4.943c0-1.091,0.39-1.984,1.03-2.682 C6.546,8.54,6.202,7.524,6.746,6.148c0,0,0.84-0.269,2.75,1.025C10.295,6.95,11.15,6.84,12,6.836 c0.85,0.004,1.705,0.114,2.504,0.336c1.909-1.294,2.748-1.025,2.748-1.025c0.546,1.376,0.202,2.394,0.1,2.646 c0.64,0.699,1.026,1.591,1.026,2.682c0,3.841-2.337,4.687-4.565,4.935c0.359,0.307,0.679,0.917,0.679,1.852 c0,1.335-0.012,2.415-0.012,2.741c0,0.269,0.18,0.579,0.688,0.481C19.138,20.161,22,16.416,22,12C22,6.477,17.523,2,12,2z"></path></svg><span class="wp-block-social-link-label screen-reader-text">GitHub</span></a></li>
<li style="color: #150E29; background-color: #fff; " class="wp-social-link wp-social-link-youtube has-main-color has-base-background-color wp-block-social-link"><a href="https://www.youtube.com/@tropicalista" class="wp-block-social-link-anchor"><svg width="24" height="24" viewbox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M21.8,8.001c0,0-0.195-1.378-0.795-1.985c-0.76-0.797-1.613-0.801-2.004-0.847c-2.799-0.202-6.997-0.202-6.997-0.202 h-0.009c0,0-4.198,0-6.997,0.202C4.608,5.216,3.756,5.22,2.995,6.016C2.395,6.623,2.2,8.001,2.2,8.001S2,9.62,2,11.238v1.517 c0,1.618,0.2,3.237,0.2,3.237s0.195,1.378,0.795,1.985c0.761,0.797,1.76,0.771,2.205,0.855c1.6,0.153,6.8,0.201,6.8,0.201 s4.203-0.006,7.001-0.209c0.391-0.047,1.243-0.051,2.004-0.847c0.6-0.607,0.795-1.985,0.795-1.985s0.2-1.618,0.2-3.237v-1.517 C22,9.62,21.8,8.001,21.8,8.001z M9.935,14.594l-0.001-5.62l5.404,2.82L9.935,14.594z"></path></svg><span class="wp-block-social-link-label screen-reader-text">YouTube</span></a></li></ul>
</div>
<div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow">
<div class="wp-block-columns is-layout-flex wp-container-core-columns-is-layout-1 wp-block-columns-is-layout-flex">
<div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow">
<p style="font-style:normal;font-weight:600">About</p>
<div class="wp-block-group has-main-accent-color has-text-color has-small-font-size has-global-padding is-layout-constrained wp-container-core-group-is-layout-15 wp-block-group-is-layout-constrained">
<p><a href="https://www.francescopepe.com/en/blog/" data-type="page" data-id="34">Blog</a></p>
<p><a href="https://www.francescopepe.com/en/shop/" data-type="page" data-id="987">Plugins</a></p>
<p><a href="https://www.francescopepe.com/en/contacts/" data-type="page" data-id="40" rel="nofollow">Contact</a></p>
<p><a href="https://www.francescopepe.com/en/cookie-policy-eu/" data-type="page" data-id="1193" rel="nofollow">Cookie Policy</a></p>
</div>
</div>
<div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow">
<p style="font-style:normal;font-weight:600">Resources</p>
<div class="wp-block-group has-main-accent-color has-text-color has-small-font-size has-global-padding is-layout-constrained wp-container-core-group-is-layout-16 wp-block-group-is-layout-constrained">
<p><a href="https://www.francescopepe.com/en/dashboard-2/" data-type="page" data-id="985" rel="nofollow">Account</a></p>
<p><a href="https://www.francescopepe.com/en/docs/" data-type="page" data-id="964">Documentation</a></p>
<div class="wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex">
<div class="wp-block-button is-style-fill" style="text-decoration:underline"><a data-popper="1285" class="wp-block-button__link has-main-background-color has-background wp-element-button" href="#" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0">Support</a></div>
</div>
</div>
</div>
<div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow">
<p style="font-style:normal;font-weight:600">Plugins</p>
<div class="wp-block-group has-main-accent-color has-text-color has-small-font-size has-global-padding is-layout-constrained wp-container-core-group-is-layout-17 wp-block-group-is-layout-constrained">
<p>Pdf Embed</p>
<p>Popper</p>
<p>Search Console</p>
</div>
</div>
</div>
</div>
</div>
<hr class="wp-block-separator alignwide has-text-color has-secondary-color has-alpha-channel-opacity has-secondary-background-color has-background is-style-separator-dotted"/>
<div class="wp-block-group alignwide is-layout-flow wp-block-group-is-layout-flow">
<div class="wp-block-group has-main-accent-color has-text-color has-link-color wp-elements-45f4c4590d38b59f221116172a248e2a is-content-justification-space-between is-layout-flex wp-container-core-group-is-layout-19 wp-block-group-is-layout-flex">
<p class="has-x-small-font-size">© 2024 - Francesco Pepe</p>
<div class="wp-block-group has-x-small-font-size is-nowrap is-layout-flex wp-container-core-group-is-layout-18 wp-block-group-is-layout-flex">
<p>Visit Formello</p>
</div>
</div>
</div>
</div>
</footer>
</div>
<template id="tp-language" data-tp-language="en_US"></template><script id="sc-store-data" type="application/json">{"checkout":{"formId":983,"mode":"test","persist":"browser"}}</script>
<sc-cart-loader
template='<sc-cart id="sc-cart" header="Cart" checkout-link="https://www.francescopepe.com/en/checkout/" style="font-size: 16px; --sc-z-index-drawer: 999999; --sc-drawer-size: 500px" > <div style="border-bottom:var(--sc-drawer-border);padding-top:1.25em;padding-bottom:1.25em;padding-left:1.25em;padding-right:1.25em"><sc-cart-header><span>Review Your Cart</span></sc-cart-header></div> <sc-line-items style="border-bottom:var(--sc-drawer-border);padding-top:1.25em;padding-bottom:1.25em;padding-left:1.25em;padding-right:1.25em" removable="true" editable="true"></sc-line-items> <sc-order-coupon-form label="Add Coupon Code" placeholder="Enter coupon code" class="" style="border-bottom:var(--sc-drawer-border);padding-top:1.25em;padding-bottom:1.25em;padding-left:1.25em;padding-right:1.25em" collapsed> Apply </sc-order-coupon-form> <sc-line-item-total total="subtotal" size="large" class="" style="padding-top:1.25em;padding-bottom:0em;padding-left:1.25em;padding-right:1.25em"> <span slot="title">Subtotal</span> </sc-line-item-total> <sc-line-item-bump label="Bundle Discount" class="" style="padding-top:1.25em;padding-bottom:0em;padding-left:1.25em;padding-right:1.25em"></sc-line-item-bump> <div class="wp-block-buttons" style="border-bottom:var(--sc-drawer-border);padding-top:1.25em;padding-bottom:1.25em;padding-left:1.25em;padding-right:1.25em"> <sc-cart-submit class="wp-block-button"> <a href="https://www.francescopepe.com/en/checkout/" class="wp-block-button__link wp-element-button sc-button "> <span data-text>Checkout</span> <sc-spinner data-loader></sc-spinner> </a> </sc-cart-submit> </div> </sc-cart> <sc-cart-icon style="font-size: 16px"> <sc-icon name="shopping-bag"></sc-icon> </sc-cart-icon>'>
</sc-cart-loader>
<div id="trp-floater-ls" onclick="" data-no-translation class="trp-language-switcher-container trp-floater-ls-names trp-bottom-right trp-color-dark flags-full-names" >
<div id="trp-floater-ls-current-language" class="trp-with-flags">
<a href="#" class="trp-floater-ls-disabled-language trp-ls-disabled-language" onclick="event.preventDefault()">
<img class="trp-flag-image" src="https://www.francescopepe.com/wp-content/plugins/translatepress-multilingual/assets/images/flags/en_US.png" width="18" height="12" alt="en_US" title="English">English </a>
</div>
<div id="trp-floater-ls-language-list" class="trp-with-flags" >
<div class="trp-language-wrap trp-language-wrap-bottom"> <a href="https://www.francescopepe.com/guida-html/"
title="Italian">
<img class="trp-flag-image" src="https://www.francescopepe.com/wp-content/plugins/translatepress-multilingual/assets/images/flags/it_IT.png" width="18" height="12" alt="it_IT" title="Italian">Italian </a>
<a href="https://www.francescopepe.com/es/guia-html/"
title="Spanish">
<img class="trp-flag-image" src="https://www.francescopepe.com/wp-content/plugins/translatepress-multilingual/assets/images/flags/es_ES.png" width="18" height="12" alt="es_ES" title="Spanish">Spanish </a>
<a href="#" class="trp-floater-ls-disabled-language trp-ls-disabled-language" onclick="event.preventDefault()"><img class="trp-flag-image" src="https://www.francescopepe.com/wp-content/plugins/translatepress-multilingual/assets/images/flags/en_US.png" width="18" height="12" alt="en_US" title="English">English</a></div> </div>
</div>
<!-- Consent Management powered by Complianz | GDPR/CCPA Cookie Consent https://wordpress.org/plugins/complianz-gdpr -->
<div id="cmplz-cookiebanner-container"><div class="cmplz-cookiebanner cmplz-hidden banner-1 banner-a optin cmplz-bottom-right cmplz-categories-type-no" aria-modal="true" data-nosnippet="true" role="dialog" aria-live="polite" aria-labelledby="cmplz-header-1-optin" aria-describedby="cmplz-message-1-optin">
<div class="cmplz-header">
<div class="cmplz-logo"><a href="https://www.francescopepe.com/en/" class="custom-logo-link" rel="home"><img width="1250" height="1250" src="https://www.francescopepe.com/wp-content/uploads/2024/04/fp-logo.png" class="custom-logo" alt="Francis Pepe" decoding="async" srcset="https://www.francescopepe.com/wp-content/uploads/2024/04/fp-logo.png 1250w, https://www.francescopepe.com/wp-content/uploads/2024/04/fp-logo-300x300.png 300w, https://www.francescopepe.com/wp-content/uploads/2024/04/fp-logo-1024x1024.png 1024w, https://www.francescopepe.com/wp-content/uploads/2024/04/fp-logo-150x150.png 150w, https://www.francescopepe.com/wp-content/uploads/2024/04/fp-logo-768x768.png 768w" sizes="(max-width: 1250px) 100vw, 1250px" /></a></div>
<div class="cmplz-title" id="cmplz-header-1-optin">Manage Consent</div>
<div class="cmplz-close" tabindex="0" role="button" aria-label="Close dialog" data-no-translation-aria-label="">
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="times" class="svg-inline--fa fa-times fa-w-11" role="img" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 352 512"><path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"></path></svg>
</div>
</div>
<div class="cmplz-divider cmplz-divider-header"></div>
<div class="cmplz-body">
<div class="cmplz-message" id="cmplz-message-1-optin">To provide the best experiences, we use technologies such as cookies to store and/or access device information. Consenting to these technologies will allow us to process data such as browsing behavior or unique IDs on this site. Not consenting or withdrawing consent may adversely affect some features and functions.</div>
<!-- categories start -->
<div class="cmplz-categories">
<details class="cmplz-category cmplz-functional" >
<summary>
<span class="cmplz-category-header">
<span class="cmplz-category-title">Functional</span>
<span class='cmplz-always-active'>
<span class="cmplz-banner-checkbox">
<input type="checkbox"
id="cmplz-functional-optin"
data-category="cmplz_functional"
class="cmplz-consent-checkbox cmplz-functional"
size="40"
value="1"/>
<label class="cmplz-label" for="cmplz-functional-optin" tabindex="0"><span class="screen-reader-text">Functional</span></label>
</span>
Always active </span>
<span class="cmplz-icon cmplz-open">
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg>
</span>
</span>
</summary>
<div class="cmplz-description">
<span class="cmplz-description-functional">Technical storage or access is strictly necessary for the legitimate purpose of enabling the use of a specific service explicitly requested by the subscriber or user, or for the sole purpose of carrying out the transmission of a communication over an electronic communications network.</span>
</div>
</details>
<details class="cmplz-category cmplz-preferences" >
<summary>
<span class="cmplz-category-header">
<span class="cmplz-category-title">Preferences</span>
<span class="cmplz-banner-checkbox">
<input type="checkbox"
id="cmplz-preferences-optin"
data-category="cmplz_preferences"
class="cmplz-consent-checkbox cmplz-preferences"
size="40"
value="1"/>
<label class="cmplz-label" for="cmplz-preferences-optin" tabindex="0"><span class="screen-reader-text">Preferences</span></label>
</span>
<span class="cmplz-icon cmplz-open">
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg>
</span>
</span>
</summary>
<div class="cmplz-description">
<span class="cmplz-description-preferences">Technical storage or access is necessary for the legitimate purpose of storing preferences that are not requested by the subscriber or user.</span>
</div>
</details>
<details class="cmplz-category cmplz-statistics" >
<summary>
<span class="cmplz-category-header">
<span class="cmplz-category-title">Statistics</span>
<span class="cmplz-banner-checkbox">
<input type="checkbox"
id="cmplz-statistics-optin"
data-category="cmplz_statistics"
class="cmplz-consent-checkbox cmplz-statistics"
size="40"
value="1"/>
<label class="cmplz-label" for="cmplz-statistics-optin" tabindex="0"><span class="screen-reader-text">Statistics</span></label>
</span>
<span class="cmplz-icon cmplz-open">
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg>
</span>
</span>
</summary>
<div class="cmplz-description">
<span class="cmplz-description-statistics">Technical storage or access that is used exclusively for statistical purposes.</span>
<span class="cmplz-description-statistics-anonymous">Technical storage or access that is used solely for anonymous statistical purposes. Without a subpoena, voluntary compliance by your Internet Service Provider, or additional records from third parties, information stored or retrieved for this purpose alone cannot usually be used for identification.</span>
</div>
</details>
<details class="cmplz-category cmplz-marketing" >
<summary>
<span class="cmplz-category-header">
<span class="cmplz-category-title">Marketing</span>
<span class="cmplz-banner-checkbox">
<input type="checkbox"
id="cmplz-marketing-optin"
data-category="cmplz_marketing"
class="cmplz-consent-checkbox cmplz-marketing"
size="40"
value="1"/>
<label class="cmplz-label" for="cmplz-marketing-optin" tabindex="0"><span class="screen-reader-text">Marketing</span></label>
</span>
<span class="cmplz-icon cmplz-open">
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg>
</span>
</span>
</summary>
<div class="cmplz-description">
<span class="cmplz-description-marketing">Technical storage or access is necessary to create user profiles to send advertisements, or to track the user on one website or several websites for similar marketing purposes.</span>
</div>
</details>
</div><!-- categories end -->
</div>
<div class="cmplz-links cmplz-information">
<a class="cmplz-link cmplz-manage-options cookie-statement" href="#" data-relative_url="#cmplz-manage-consent-container" data-no-translation="" data-trp-gettext="">Manage options</a>
<a class="cmplz-link cmplz-manage-third-parties cookie-statement" href="#" data-relative_url="#cmplz-cookies-overview" data-no-translation="" data-trp-gettext="">Manage services</a>
<a class="cmplz-link cmplz-manage-vendors tcf cookie-statement" href="#" data-relative_url="#cmplz-tcf-wrapper" data-no-translation="" data-trp-gettext="">Manage {vendor_count} vendors</a>
<a class="cmplz-link cmplz-external cmplz-read-more-purposes tcf" target="_blank" rel="noopener noreferrer nofollow" href="https://cookiedatabase.org/tcf/purposes/" data-no-translation="" data-trp-gettext="">Read more about these purposes</a>
</div>
<div class="cmplz-divider cmplz-footer"></div>
<div class="cmplz-buttons">
<button class="cmplz-btn cmplz-accept">Accept</button>
<button class="cmplz-btn cmplz-deny">Nega</button>
<button class="cmplz-btn cmplz-view-preferences">View preferences</button>
<button class="cmplz-btn cmplz-save-preferences">Save preferences</button>
<a class="cmplz-btn cmplz-manage-options tcf cookie-statement" href="#" data-relative_url="#cmplz-manage-consent-container">View preferences</a>
</div>
<div class="cmplz-links cmplz-documents">
<a class="cmplz-link cookie-statement" href="#" data-relative_url="">{title}</a>
<a class="cmplz-link privacy-statement" href="#" data-relative_url="">{title}</a>
<a class="cmplz-link impressum" href="#" data-relative_url="">{title}</a>
</div>
</div>
</div>
<div id="cmplz-manage-consent" data-nosnippet="true"><button class="cmplz-btn cmplz-hidden cmplz-manage-consent manage-consent-1">Manage Consent</button>
</div> <div
class="wp-lightbox-overlay zoom"
data-wp-interactive="core/image"
data-wp-context='{}'
data-wp-bind--role="state.roleAttribute"
data-wp-bind--aria-label="state.currentImage.ariaLabel"
data-wp-bind--aria-modal="state.ariaModal"
data-wp-class--active="state.overlayEnabled"
data-wp-class--show-closing-animation="state.showClosingAnimation"
data-wp-watch="callbacks.setOverlayFocus"
data-wp-on--keydown="actions.handleKeydown"
data-wp-on-async--touchstart="actions.handleTouchStart"
data-wp-on--touchmove="actions.handleTouchMove"
data-wp-on-async--touchend="actions.handleTouchEnd"
data-wp-on-async--click="actions.hideLightbox"
data-wp-on-async-window--resize="callbacks.setOverlayStyles"
data-wp-on-async-window--scroll="actions.handleScroll"
tabindex="-1"
>
<button type="button" aria-label="Close" style="fill: var(--wp--preset--color--main)" class="close-button" data-no-translation-aria-label="">
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" width="20" height="20" aria-hidden="true" focusable="false"><path d="M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"></path></svg>
</button>
<div class="lightbox-image-container">
<figure data-wp-bind--class="state.currentImage.figureClassNames" data-wp-bind--style="state.currentImage.figureStyles">
<img data-wp-bind--alt="state.currentImage.alt" data-wp-bind--class="state.currentImage.imgClassNames" data-wp-bind--style="state.imgStyles" data-wp-bind--src="state.currentImage.currentSrc">
</figure>
</div>
<div class="lightbox-image-container">
<figure data-wp-bind--class="state.currentImage.figureClassNames" data-wp-bind--style="state.currentImage.figureStyles">
<img data-wp-bind--alt="state.currentImage.alt" data-wp-bind--class="state.currentImage.imgClassNames" data-wp-bind--style="state.imgStyles" data-wp-bind--src="state.enlargedSrc">
</figure>
</div>
<div class="scrim" style="background-color: var(--wp--preset--color--base)" aria-hidden="true"></div>
<style data-wp-text="state.overlayStyles"></style>
</div><script src="https://www.francescopepe.com/wp-includes/js/comment-reply.min.js?ver=6.6.1" id="comment-reply-js" async data-wp-strategy="async"></script>
<script id="trp-dynamic-translator-js-extra">
var trp_data = {"trp_custom_ajax_url":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/translatepress-multilingual\/includes\/trp-ajax.php","trp_wp_ajax_url":"https:\/\/www.francescopepe.com\/wp-admin\/admin-ajax.php","trp_language_to_query":"en_US","trp_original_language":"it_IT","trp_current_language":"en_US","trp_skip_selectors":["[data-no-translation]","[data-no-dynamic-translation]","[data-trp-translate-id-innertext]","script","style","head","trp-span","translate-press","[data-trp-translate-id]","[data-trpgettextoriginal]","[data-trp-post-slug]"],"trp_base_selectors":["data-trp-translate-id","data-trpgettextoriginal","data-trp-post-slug"],"trp_attributes_selectors":{"text":{"accessor":"outertext","attribute":false},"block":{"accessor":"innertext","attribute":false},"image_src":{"selector":"img[src]","accessor":"src","attribute":true},"submit":{"selector":"input[type='submit'],input[type='button'], input[type='reset']","accessor":"value","attribute":true},"placeholder":{"selector":"input[placeholder],textarea[placeholder]","accessor":"placeholder","attribute":true},"title":{"selector":"[title]","accessor":"title","attribute":true},"a_href":{"selector":"a[href]","accessor":"href","attribute":true},"button":{"accessor":"outertext","attribute":false},"option":{"accessor":"innertext","attribute":false},"aria_label":{"selector":"[aria-label]","accessor":"aria-label","attribute":true},"image_alt":{"selector":"img[alt]","accessor":"alt","attribute":true},"meta_desc":{"selector":"meta[name=\"description\"],meta[property=\"og:title\"],meta[property=\"og:description\"],meta[property=\"og:site_name\"],meta[property=\"og:image:alt\"],meta[name=\"twitter:title\"],meta[name=\"twitter:description\"],meta[name=\"twitter:image:alt\"],meta[name=\"DC.Title\"],meta[name=\"DC.Description\"],meta[property=\"article:section\"],meta[property=\"article:tag\"]","accessor":"content","attribute":true},"page_title":{"selector":"title","accessor":"innertext","attribute":false},"meta_desc_img":{"selector":"meta[property=\"og:image\"],meta[property=\"og:image:secure_url\"],meta[name=\"twitter:image\"]","accessor":"content","attribute":true}},"trp_attributes_accessors":["outertext","innertext","src","value","placeholder","title","href","aria-label","alt","content"],"gettranslationsnonceregular":"346f7a3bbf","showdynamiccontentbeforetranslation":"","skip_strings_from_dynamic_translation":[],"skip_strings_from_dynamic_translation_for_substrings":{"href":["amazon-adsystem","googleads","g.doubleclick"]},"duplicate_detections_allowed":"100","trp_translate_numerals_opt":"no","trp_no_auto_translation_selectors":["[data-no-auto-translation]",".wp-block-code"]};
</script>
<script src="https://www.francescopepe.com/wp-content/plugins/translatepress-multilingual/assets/js/trp-translate-dom-changes.js?ver=2.8.3" id="trp-dynamic-translator-js"></script>
<script id="wp-block-template-skip-link-js-after">
( function() {
var skipLinkTarget = document.querySelector( 'main' ),
sibling,
skipLinkTargetID,
skipLink;
// Early exit if a skip-link target can't be located.
if ( ! skipLinkTarget ) {
return;
}
/*
* Get the site wrapper.
* The skip-link will be injected in the beginning of it.
*/
sibling = document.querySelector( '.wp-site-blocks' );
// Early exit if the root element was not found.
if ( ! sibling ) {
return;
}
// Get the skip-link target's ID, and generate one if it doesn't exist.
skipLinkTargetID = skipLinkTarget.id;
if ( ! skipLinkTargetID ) {
skipLinkTargetID = 'wp--skip-link--target';
skipLinkTarget.id = skipLinkTargetID;
}
// Create the skip link.
skipLink = document.createElement( 'a' );
skipLink.classList.add( 'skip-link', 'screen-reader-text' );
skipLink.href = '#' + skipLinkTargetID;
skipLink.innerHTML = 'Skip to content';
// Inject the skip link.
sibling.parentElement.insertBefore( skipLink, sibling );
}() );
</script>
<script id="mkaz-code-syntax-prism-js-js-extra">
var prism_settings = {"pluginUrl":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/code-syntax-block\/"};
</script>
<script src="https://www.francescopepe.com/wp-content/plugins/code-syntax-block/assets/prism/prism.js?ver=1715219736" id="mkaz-code-syntax-prism-js-js"></script>
<script src="https://www.francescopepe.com/wp-includes/js/dist/hooks.min.js?ver=2810c76e705dd1a53b18" id="wp-hooks-js"></script>
<script src="https://www.francescopepe.com/wp-includes/js/dist/i18n.min.js?ver=5e580eb46a90c2b997e6" id="wp-i18n-js"></script>
<script id="wp-i18n-js-after">
wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } );
</script>
<script src="https://www.francescopepe.com/wp-includes/js/dist/vendor/regenerator-runtime.min.js?ver=0.14.0" id="regenerator-runtime-js"></script>
<script id="surecart-components-js-extra">
var surecartComponents = {"url":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/surecart\/dist\/components\/surecart\/surecart.esm.js?ver=1724978120"};
var scData = {"cdn_root":"https:\/\/surecart.com\/cdn-cgi\/image","root_url":"https:\/\/www.francescopepe.com\/en\/wp-json\/","plugin_url":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/surecart","api_url":"https:\/\/api.surecart.com\/v1\/","currency":"eur","theme":"light","pages":{"dashboard":"https:\/\/www.francescopepe.com\/en\/dashboard-2\/","checkout":"https:\/\/www.francescopepe.com\/en\/checkout\/"},"page_id":"","nonce":"41a5a1f59e","nonce_endpoint":"https:\/\/www.francescopepe.com\/wp-admin\/admin-ajax.php?action=sc-rest-nonce","recaptcha_site_key":"","claim_url":"","admin_url":"https:\/\/www.francescopepe.com\/wp-admin\/","getting_started_url":"https:\/\/www.francescopepe.com\/wp-admin\/admin.php?page=sc-getting-started","user_permissions":{"manage_sc_shop_settings":false},"is_account_connected":"1"};
var scIcons = {"path":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/surecart\/dist\/icon-assets"};
var surecartComponents = {"url":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/surecart\/dist\/components\/surecart\/surecart.esm.js?ver=1724978120"};
var scData = {"cdn_root":"https:\/\/surecart.com\/cdn-cgi\/image","root_url":"https:\/\/www.francescopepe.com\/en\/wp-json\/","plugin_url":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/surecart","api_url":"https:\/\/api.surecart.com\/v1\/","currency":"eur","theme":"light","pages":{"dashboard":"https:\/\/www.francescopepe.com\/en\/dashboard-2\/","checkout":"https:\/\/www.francescopepe.com\/en\/checkout\/"},"page_id":"1","nonce":"41a5a1f59e","nonce_endpoint":"https:\/\/www.francescopepe.com\/wp-admin\/admin-ajax.php?action=sc-rest-nonce","recaptcha_site_key":"","claim_url":"","admin_url":"https:\/\/www.francescopepe.com\/wp-admin\/","getting_started_url":"https:\/\/www.francescopepe.com\/wp-admin\/admin.php?page=sc-getting-started","user_permissions":{"manage_sc_shop_settings":false},"is_account_connected":"1"};
var scIcons = {"path":"https:\/\/www.francescopepe.com\/wp-content\/plugins\/surecart\/dist\/icon-assets"};
</script>
<script src="https://www.francescopepe.com/wp-content/plugins/surecart/dist/components/static-loader.js?ver=a63fafc54e2b993044b3-2.29.4" id="surecart-components-js"></script>
<script src="https://www.francescopepe.com/wp-content/plugins/google-site-kit/dist/assets/js/googlesitekit-consent-mode-3d6495dceaebc28bcca3.js" id="googlesitekit-consent-mode-js"></script>
<script id="wp-consent-api-js-extra">
var consent_api = {"consent_type":"optin","waitfor_consent_hook":"","cookie_expiration":"30","cookie_prefix":"wp_consent"};
</script>
<script src="https://www.francescopepe.com/wp-content/plugins/wp-consent-api/assets/js/wp-consent-api.min.js?ver=1.0.7" id="wp-consent-api-js"></script>
<script id="cmplz-cookiebanner-js-extra">
var complianz = {"prefix":"cmplz_","user_banner_id":"1","set_cookies":[],"block_ajax_content":"","banner_version":"20","version":"7.1.0","store_consent":"","do_not_track_enabled":"","consenttype":"optin","region":"eu","geoip":"","dismiss_timeout":"","disable_cookiebanner":"","soft_cookiewall":"","dismiss_on_scroll":"","cookie_expiry":"365","url":"https:\/\/www.francescopepe.com\/en\/wp-json\/complianz\/v1\/","locale":"lang=en&locale=en_US","set_cookies_on_root":"","cookie_domain":"","current_policy_id":"30","cookie_path":"\/","categories":{"statistics":"statistics","marketing":"marketing"},"tcf_active":"","placeholdertext":"Click to accept {category} cookies and enable this content","css_file":"https:\/\/www.francescopepe.com\/wp-content\/uploads\/complianz\/css\/banner-{banner_id}-{type}.css?v=20","page_links":{"eu":{"cookie-statement":{"title":"Cookie Policy ","url":"https:\/\/www.francescopepe.com\/en\/cookie-policy-eu\/"},"privacy-statement":{"title":"Privacy Policy","url":"https:\/\/www.francescopepe.com\/en\/privacy-policy\/"}}},"tm_categories":"","forceEnableStats":"","preview":"","clean_cookies":"","aria_label":"Click to accept {category} cookies and enable this content"};
</script>
<script defer src="https://www.francescopepe.com/wp-content/plugins/complianz-gdpr/cookiebanner/js/complianz.min.js?ver=1717145349" id="cmplz-cookiebanner-js"></script>
</body>
</html>
