Please, enter a valid email!
00 days
00 hours
00 minutes
00 seconds

How to Build Custom Headers & Footers with Elementor Pro [Free Webinar]

With Alexandra Payne you will learn how to create custom headers and footers using Elementor Pro. Also this tutorial covers elementor transparent header topic.

Having a custom header is important because you can modify it as per your needs by adding custom-built menu, mega-menu or even removing it completely making use of the canvas layout. The same story goes about the footer you can use it to present any possible content or just giving it a minimal look without cramming it with links.

elementor transparent header

In our webinar you'll learn how to:

  • create a custom header or footer for your theme;
  • create complex and creative headers with JetBlocks plugin;
  • create a transparent sticky header;
  • make your headers mobile-friendly.

By clicking here, you may watch the useful webinar that will definitely help you in creating headers and footers!

Elementor Tutorial: How to Create Custom Headers with Elementor Pro

Elementor Tutorial: How to Create Custom Headers with Elementor Pro

Full transcript of the video

Yes, as I have said it's our second webinar and we are planning on doing it every week. We are gonna pick a topic that you guys might be interested in. And if you have any suggestions, maybe any ideas for our future webinars, for the next week or something, just type it in the comments or just contact us in our social channels, like Facebook or Instagram or whatever, whatever social channels you are following.

So, also if the audio is good, if the video quality is good, just let me know in the live chat, just type that like a "plus" or something that you can hear what I am saying. So it is gonna be a great help. So I know that the technical setup is okay.

So, should I start? I think, yeah, enough talking and yeah.

So, the first step that you should do if you want to create a header - let me show you the setup that I am starting with. And yeah, here I am using the types of standard, uses standard types. So, it is, you know it consumes..,it consumes less memory and you know just Chrome runs faster, because I am using Google Chrome. Just like this page load and then later we are gonna proceed to creating the headers over here. And here I would just show you my home page. And it is loading a little slowly, because of this stream, but I mean what can I do. And..  So, this is kind of what we got over here. You can kind see the header already, here it is. This is the, like the default header that you get on clean WordPress, without any custom headers that you might create with Elementor Pro, without any custom header templates, without any other plugins. So, this is the like clean, core WordPress header. So nothing in it.

I had some templates created before, but I deleted them. So we can start from scratch and the same applies. Okay, loads kind slowly, because of the stream, because we are now live, and you know stuff happens. And this is the header. Okay, this was the header, and this is the footer, because you know. Okay, let's scroll back. So this is kind of what we are starting with. Then if we go here, and to access the interface that allows you to create header templates. What you should is go to “Templates” and go to the “Theme Builder”. So the Theme Builder is kind of the library of your templates for headers, footers, single page templates and archive templates. So, in order to start creating your first header, it is pretty intuitive, you have to click here the type. You leave it as “Header”. And then called it “Header Template” whatever. And then you can start creating.

Oh, hi, I see we have an one person in the chat, so hello. I am sorry, I will not try and pronounce your name, because I really, really afraid of making mistakes. So, I pronounced it in the wrong way, yeah sorry. I just really have to see there hi.

And if you have any questions along the way, if any questions appear, just let me know, just type them in the comments, and on the live chat. I am monitoring the live chat, and I have the second monitor here. So just if you have any questions or if you want me to clarify something, maybe I am, you know maybe wants to, you know maybe wants me to go into more detail about some things that I am doing, just let me know in the live chat.

Okay, so right away, right from the stored, Elementor offers you to select a template and start working with it. But, but since we are doing the custom type of thing, so let's just do it ourselves. Okay, so this is like pretty much a normal Elementor page. The section that you have to work on it is gonna be right here, and what you should do is to create  a new section.

First, we are gonna work with the Elementor tool set, like the standard Elementor Pro tool set for recreating headers. So, Elementor Pro you get a site of widgets that allows you to create headers. And later in this tutorial…later in this tutorial…I see more people in the chat, hi their. And so, later in this tutorial starting this sentence the third time, okay, and later we are gonna have a look at the more extended pack for creating headers, which is going include more widgets, that gonna allow you to make more complex and more functional headers, like such as log in, and register links, login forms.

Okay, let me just scroll really quickly. Jetblocks! So, this is this plugin, that this is set of widgets for creating custom headers. And this is an additional plugin. This is an add-on for Elementor, and it works with Elementor free as well. And..Yeah, if you get it in, for example, Monstroid2, which is a great theme and it goes in.. out of the box with possibilities to create custom headers and footers. And you don't need Elementor Pro as you keep working with Elementor free. But I am drifting away, I am sorry, I know my bad.. And “Jetblocks”. Having a look at it later. Just get it for Elementor Pro, if you are gonna create better headers and footers. But about Jetblocks later. This is an optional tool and we are going focus too much on it in this video. This video is mostly about creating headers with Elementor Pro.

The third kind of section, third part of this video is gonna be a creating sticky headers. So, how to make a header sticky, how to make it change color, like if you create a elementor transparent header, you want it to be transparent there at the top, one is at the top. But when you scroll down you want it to have a solid background, solid color as a background. So we are gonna look at that,as well.

And the fourth section is responsive headers. How to make your headers adjust you the mobile layout. So, they look nice, they function properly and you know, it works overall pretty good. Because as you know a lot of traffic now goes for mobile devices and it it important to optimize your layouts for mobile.

All right, so much talking, right. Okay.

Now, let's create a layout. What I wanna do is to create a really simple header. Okay, this is the latest one. To create a really simple header layout and just show you the basic site of tools that you usually need for creating headers. And if you have a project, that you want to recreate yourself, you just go and do it using this widgets.

So, first  what you usually start with is the “Site logo”. And we are gonna just drag it here and drop it into this section. And a site logo is like, this is the widget that functions a little bit differently from the image widget. Like you see here you might think, that somewhere here I have to use select the image to put it in place of this placeholder, right. But it doesn't work that way. What we should do is to go to the Customizer and actually pick a logo for your website through the Customizer. This is kind of the faster way and let's do that, let's just do that. I went to my home page, and I know got to the Customizer menu. And now we are gonna see how we can add the actual logo to our website.

So, Elementor knows what logo our website has. This is like a sort of a global setting that you, you know, that you work with here. You add a logo to your entire website and not just to this specific header.

Okay, let it load. This might take a while, because of this stream, because we are now online on YouTube, so it might take a little bit of time for it to load. But let me just scroll down and find where the actual logo is.

So, this one seems like it and let's select it. Now it allows us to crop the logo. We are gonna need the full logo, the entire image. And now we crop, and now we save this as our website logo. Here you can also change the title of your website. And now let's click publish. So, it saves our changes in the Customizer, and we now have a logo for our website. Now as it publishes the changes and saves everything, let us get back to our header. And here let just,okey, let's try and refresh. So, all the changes that we have applied back there in the Customizer I now applied here. We can see our logo in the actual header, inside of this placeholder.

Okey, let's give it a second to load and I keep monitoring the chat and if you have any questions, I know that what we are doing right now is not rocket science or anything like that, it is not super hard, and it's pretty intuitive, but this is the live stream and if you have any questions regarding what we are doing right now, regarding you know dealing with headers and widgets for headers, the widget set that you get with Elementor Pro, that you have here under the site app.

If you have any questions, maybe you how any suggestions, maybe you want me to try and do something here with this header, just type it in the live chat, I am monitoring the chat constantly. So just like let me know. here let me check. Okey, so now our logo is published. We have it right here, and let just try and add that site logo. We should one more time and if it doesn't work probably we should, probably refresh the page one more time, I know. Maybe that didn't have enough time to catch up. Oh, here it goes, now we have it. Here's the logo and you can align the logo like the way you want, write the caption, custom URL, custom URL could be.

Okay, it could be an your homepage, as you usually do. Again, the site URL it is also an option that you can change in the Customizer. You can also link to a media file, so it opens in the lightbox or just set it to “None”, so it is not do anything.

Thanks, I see the message, it says thanks in the live chat, so thank you for being here, thank you for watching this live stream, and thank you for joining in. If you have any questions, maybe you have any suggestions for me to show you in this stream, just let me know.

Alright. So, what are we doing next. Okay. Okay, now let's go to the “Style”. And in the “Style” what we can change is the width of the logo. Let's just make it a little bigger. Okay, then the width which is pretty to your setting. Then the state on “Normal”, state on “Hover”, “Border Type”, of you want to add any border around your logo. Then what we can do here is to adjust the size of the sections and proceed to the next widget.

Okay, the next widget it can also be the “Site Title” , if you want to add the “Site Title” to your page, the page title, it is.. It might look something like breadcrumbs, when you add it. So, you see the title of the page in the actual header not in the page. But in the header it might look something like the breadcrumbs. And now the “Search Form”. We gonna finish with the navigation menu, so I will skip it for now. The ‘Search Form” which is gonna allow you, not you, but your visitors to search across your website. So, you can select the “Skin”, like this is the type of design. Something like that. “Classic” gives you a little bit more settings and also a button. And the “Full Screen” is a really interesting feature, because once you click on the button you have the full screen like this pop-up, this Search pop-up, that opens up and you can type in your search query here.

Alright, and I am not really going to put this “Search” widget in my header. We could, but not this time. And this “Sitemap”. “Sitemap” is something that shows you, okay let me just. Let show it to you. The ‘Sitemap” is something that shows you all the pages and all of the categories on your website. I do not have much, because I just installed this theme for its testing and for tutorials. So, this is what it looks like, and this are all clickable. So, once you click on one of these, you gonna be redirected to that exact page category or a post or whatever.

Now the last one navigation menu. Let's just drag it here. And see what settings we have for the navigation menu. First off, as you know you can edit menus with. If you got to that, if you got to appearance menus and you can edit them there, or you can access pretty much the same settings, if you go to, if you go back to the Customizer, and if you go to menus. And here you select the menu that you want to add it or you create any menu. Then you see your actual layout and this indicate that these are the sub items of the menu item. So this, in the actual header it creates a drop-down menu. And you can also sign them to locations.

Okey, here, here we are and here we select the menu that you want to display here. There goes, there is the actually drop-down. And it's created automatically and you can later style and apply some style setting to it. You can change the layout which is horizontal, vertical or drop-down options. So, that is look something like that for a vertical layout.

If I have useful for creating a vertical pattern, can you, can you call the header really, if it is vertical. It's rather something like a “SiteBar”, but when you have it on your left from your right and have a menu in there and follows you as you scroll down the page, which is a pretty interesting concept. So, this is where you could use the vertical menu. And now that “Drop-down”. The drop-down is a sort of a hamburger menu, that opens out right here, like a huge drop-down. And you could later adjust its look and its styling, like that. And it takes up the width of the entire column. So, if you want to make it more narrow, you just have to resize the column, but we are going to tools, to go the header horizontal style with the regular one. And we want to align to the right. You have also a number of animations here, which is underline, overline. We gonna go over those they are just, they look very nice, look like that, and different types of hover animations. Then the “Submenu indicator” is this little thing, this little icon next to the drop-down menu, next to the parent item on the sub items. So, just changes the look of this icon. So, nothing extraordinary. And they look inside the “Breakpoint”. So, for the tablet and for the mobile, and this “Breakpoint” indicates at which size of the page this header actually resizes into the mobile version of the header.

Okey, I hope it is clear and now let's say we wanted to resize on this 768. It is gonna be nice. Stretch the drop-down of menu to full width. No, let's not do that. Then “Align”. This is actually the setting for the mobile drop-down. So, when it, let me show you. So, something like that. We are gonna get back to designing and styling the mobile headers a little bit later. But is this here this is what happens when it reaches the breakpoints, when it reaches the 768 pixels. Something like that. You can change the look of the “Toggle Button” in the alignment of the actual toggle, like this. And the alignment of the items in your menu. And even the drop-down menu also works in this mobile version of your menu. And here it doesn't do much. Let's see on desktop. Okay, this option is not clearing for me right now. Okay, hold on, if we do that  and if we turn this option on, what we gonna have is the full width drop-down menu. So, this is what it is for. This works not on mobile layout, but this works on the desktop layout, but when you select the drop-down option right here. All right.

Now we have spent enough time with talking about the navigation menu. Here is the styling settings which pretty intuitive, pretty simple. There is a normal set of style settings, that usually have an Elementor and you are gonna see anything new in here if you are used to working with Elementor. Let me just give it a little bit of style here, some style settings. Wanna just a little bit. Okay, now the width of the “Pointer”. It is gonna be the size of this little thing, that you have underneath, like that. I think this animated once you hover over your item. So, if you want to get back to default, just erase any value that you have put in here. The “Horizontal Padding” it is something like add some space between the items. “Vertical Padding” it does the same thing but between the item and the like a borders of the section that this item is in. And the “Space Between” the widgets. Again to get back to the default value let  just erase everything from there. Alright, 15. Okay, now some style settings for the drop-down.

Like I am gonna go really in detail about style settings, because you know they are pretty easy to figure out yourself and we are better gonna focus on some other feature of Elementor Pro header editor, that might not be that obvious. So, for now let me just add a little, a little accent color there.

Okay, we have pretty much site with the header, let's see. There it is right down with the layout. It could be different layout, it could be like something more rich. You could add also social icons there. Some people do that. If you look for icons here that social icons. You just add  one more column. Just click with the right mouse button on this column I do here. And we have add new column option, which gives you one more column here in the layouts, like that. And you just go and hold on and you. You drop the social icons right there and you have them in your layout. But  let's not so that. Let's really not focus on the simplest layout. And let's click “Publish” and see how we can add this header and make it appear on our actual website. Hold on. What have you click here is ‘Add condition” . Obvious right. And this is the interface that you get and it allows you to customize on what parts of your website this header is actually gonna be visible. If you choose entire site it is gonna appear everywhere on the home page, on 404 page, on all your posts and pages on your website, literally, everywhere. Unless you set  opposite, unless you set the setting that size the opposite. Like here we have include, which means that this place, this like, this type of the page, here it is included in the list of pages that show this header. I am sorry, a little, little thirsty. And if you want to exclude the page, if you do not want this header to be shown on this particular page, you just select exclude and you go an you select one of these items here. So, let me explain. “Archives” are the archives of posts, categories, tags, and formats. Let's not go really in detail on this topic. And if you are interested in learning more about what archives, what archive templates are, what simple page templates are and how to work with them using Elementor Pro, how to customize the layout just let us know in the live chat, let us know on the social channels if you follow any, if you still don't just go and follow. Oh, go and follow Template Monster in Facebook or Instagram, or whatever social media platform that you find comfortable using. And so, all archives work. You can also select singular, if you want to exclude a specific page or a specific post. So let's go here. Post and if you don't select anything here and just leave it as all, it's gonna mean that it is gonna be like not visible this header, and it is going to be not visible on all of the posts on your website. Or let's, let's have a look at the more realistic case.

Okay, hold on. “Pages”. Now pages and here you start typing the name of the page. Let's say maybe it's for of or maybe it's contacts. Okay, there we go. I don't have that many pages on the website. So, if you have a huge selection of pages here. So, we select “Contacts” and it means that this header is not going to be displayed on this particular page, because it says “Exclude” here. You have the same number of settings here as well. So, you can only show this header on, let's set on the post archive pages or something, or only when the user views your products, if you also have WooCommerce, for example, or when the user views posts. And this option, this interface, this, this way to manage your headers additional allows you to create different headers for different parts of your website, which is a great technique. So, you can create multiple header templates and apply them to different parts of your website. But let's set it back to entire site. And we don't need to click anything here anymore really. And let's click “Save” and close. And I am kind of covering the button, I'm sorry.

So, we are done with the header. Now what we could do is go and see it on our website. Just refresh your website. Let it load right now and see how it looks on the actual homepage.

Next we are gonna proceed to have a look at the set of widgets that we get with Jetblocks plugin and I am also going to share the link to this plugin to our live chat.

I see a new message. I see a message in the live chat. Hello! It's okay, it's not too bad if you have missed the first part, because you can a later rewatch it. And thank you so much for the compliment, I was a little bit nervous and okay, I am a kind of a little bit more relaxed right now, since we are okay. It's going quite okay. And thank you for this message, because you really cheer me up a little bit. I am going to try my best to really explain this to you in the most clear way. If you are new to Elementor, if you are new to Elementor Pro, if you are new to creating headers and working with headers templates  and applying them to your website and really managing the theme parts with the Theme Builder by Elementor.

So, here we have our… Let's close the Customizer. Why did I have it open?! So, this is our homepage and as you see the header is now applied to our page and okay, let it load. Okay, and while it's loading.

So, now it is not a sticky header, it is a simple normal header and how our drop-down menu here. And we could, we could actually adjust the width. All this items would work and style it a little bit more, but I don't want to spend so much of my time and your time here on adding it's in the styling settings. So, let's just, let's just leave it like that. It looks okay, or looks okay, kind of bearable.

So, now the next step I want you touch upon in this video is the Jetblocks plugin, which is an optional plugin that allows you to expand the number of widgets that you have in Elementor Pro. And that is specifically for working with headers. Let's scroll down, where is it. Here we go, Jetblocks plugin. Let me just, let me just share this with you. So, while I am talking about this plugin you could go follow this link and read about it yourself. Give me a second. So, this is the Jetblocks plugin. Yeah, so you can follow this link and you can see what it is all about, you can see the live demo, because I don't want to really spend a lot of time showing this to you on my screen here. Let's better focus on the function of the actual widgets. So what we can do right here.

Okay, should I delete this one.. Okay, yeah, let's delete this one. Let's delete this one and create a new one with the Jetblocks plugin, with this tool set. As you see here some of these widgets.. they, they are kind of the same widgets that you have with Elementor Pro, but with a little bit different settings. And where the “Site Logo” its a little bit different. The work flow of adding the site logo is a little bit different. Let this load. Okay. So, this is what it gives you from the start. Just the title of the page. It pulls out the title from the global settings that you have site for this page. And in the logo tab you can set text, image, or both text and image. And here you can upload the PNG or JPEG file. If it doesn't have the transparent background, it could be JPEG, well. But whatever you can, you can upload the image file here or you can upload the SVG file here. So, it is the right in version of your logo. So, when the page is being resized by the user, the logo doesn't lose its quality. And let's go here. You can choose one of two options. Either an SVG file or the image. Like whatever, whatever you prefer.

Oh, we have another, we have another message in the live chat. Hi there and thank you so much for the heart!! I am, I am so glad, but more people are coming, more people are watching and commenting. Thank you so much, it is really nice to hear, because there is, as I have said a little nervous about this and yeah, I really hope I can deliver the rights, you know the right way of working with this plugin. And it's really nice getting this kind of comments, really appreciate that guys, thank you so much!

So, we have just added the logo. You see the workflow a little bit different. Before you had to got to the Customizer, in order to add the global, in add the logo in global settings, but now we have to do is just add the image here. you doing with the images widget or something like that. Okay. And in the settings here the “Linked Logo”, which simply means that is gonna redirect you to the homepage. So, once you click on it is gonna be like, like the normal function of the logo. Once you click  on it you are taken to the homepage, to the main page of your website. If you don't want this logo to be linked, when you are on the homepage, because you think it wouldn't make sense, so just switch this option on. And it is not gonna be clickable, when you are on the homepage. So, now this style settings is simply the alignment. And if you have any text in this widget, this is gonna be the “Typography” setting and the “Color settings”. So, it was the logo in a JetBlocks plugin. We have just seen the difference and we are gonna go over the Jetblocks plugin pretty quick. So, if you are just sick around and later we are gonna proceed to creating, tell me, to creating sticky headers. How to make these headers sticking, how to make it follow as you scroll down the page and how to create responsive headers for mobile devices, and tablet devices. So it all looks nice and clean.

So, now, we are done with the header. Let's create one more column, add new column. So let's resize it, because here a little bit more space for the menu. Now, go back to the elements. Scroll down to find Jetblocks. And let's have a look at those widgets, that you don't have in Elementor Pro. These are “Authorization Links”, “Breadcrumbs”, “Login Form”, “Registration Form”, “Search”. “Search” you have, you have Search.. You have Search in Elementor Pro widgets site,just saying. And the “Hamburger Panel”. We are gonna look at the Hamburger Panel a little bit later. Before let's do authorization links. These are simply delineates that allow you to..allow you visitor to login into your  website or to create an account on your WordPress website. And let it load. And let's see how it looks. Okay, here it is. So, it is looking pretty nice. It gives you the text layout that you can also change. You can change the prefix here. So it would say something else. Like you know. And the icons for both actions, for both links login and register. And also inside the URL here. So the user, ones the user clicks on the link, he or she is gonna be redirected. It is gonna be redirected to this URL. Then, “Logout link”. So you see changes here. And you can customize the look of it.

Then the “Register link”. So, you have pretty much the same number of settings for each of this links. And it is like “Login”, “Logout”, ‘Register” and “Registered’. And here you can change the order of the links here, change the layout a little bit. Something like that. And yeah, if you change the order you are gonna have to change the text prefix. Okay, let's just get the normal order back here. And in the “Style”, this is as usual alignment. And the styles for the links. So, you can change color, the typography settings, and all that jump. Deleting this one.

Next widget. I really want to go over this pretty quickly, because the next part of our video is sticky headers, which is a pretty fun thing. And I also have a nice trick for you, that you can do. You can change the color of the background here. You can make it transparent or make it solid color, which is pretty nice feature.

So, what's next. “Login form”. Pretty much the same as the registration form. So, I am just gonna drop it in here and we are gonna stop at the registration form, which is gonna have a look at the login form. They are essentially pretty much the same thing. But they have a different function, but they have pretty much the same set of settings. So, to not waste our time, let's just at one of these forms. So, you see change the labels. At the lost password, at the lost password link here, and the change the style settings. The style settings for for the fields, the style settings for the buttons and a typography settings for the text layout. So, we are pretty much done with this form. This is a pretty cool feature that allows your visitors to like login in and register on your website. And you should not add it to your header, but you should add it to that page to which you are gonna redirected your user by that link, that is login or the register. So the user clicks on that link and they are being followed. They are being, sorry, they are being redirected to that page on which you have this form. And it is gonna allow your user to register or login to your website. Where is that,okay. Here we go.

And the last one. The last one before we proceed to the hamburger panel pretty interesting one.”Breadcrumbs”. Let's see what breadcrumbs actually is. And what you usually wanna to do is add breadcrumbs to a new section here. So it is kind of, okay, keeps loading. Loading a little bit slowly, because of this stream. But let's be patient, let's give it a little bit of time. And there we go. Usually I want to do something like that. You want to grab this widget and want to place it in here. So, it is kind of underneath the actual header, like that. And let's usually, let's leave it here, it is pretty nice. And “Show on Front Page”. Front page means the homepage, usually don't need the breadcrumbs. Okay. If you, if you don't know, if you are not familiar with the breadcrumbs thing, this is kind of, we can it shows you path, that you have, that you.. you know, you have followed on the website. Like the home is the main page, and then when you went to contacts it is gonna show home, then it is gonna show contacts or it is gonna show the name of the post that you have in currently. And it would be like home, blog, and the name of the post, something like that. It really the way it is gonna look really depends on your settings that you apply to this specific functionality. So, show on the front page. If you want it to be shown on the front page, switch the toggle on. “Show Page Title”. If you want you could enable this. “Show Prefix” and the custom prefix here. The custom prefix for the breadcrumbs. It is really an optional thing to do. The type of the separator and the alignments. Now, the style settings. Also mostly the typography settings and the paddings, and the settings for the separator icon. So pretty normal and usual set, nothing extraordinary, nothing like rocket science or something. Okay.

We are now at Jetblocks back again. So what I want to do is add the navigation menu right there. But before I do that let's drop the “Hamburger Panel” here. And what actually the hamburger panel does is just pretty much. It as the hamburger icon, but what's special about it is that it doesn't open unlike the navigation menu in the default Elementor site. It doesn't open your menu in the drop-down. It opens this, this thing, this like, this panel here. Let's call it the panel. It opens this panel here. That is might lie down from the right, from the left. And you could put any type of content in here. It couldn't be just menu, like, such a boring thing is just menu. You could put images here, videos, banners, contact forms, you know, any type of content, because what is here is defined by the template that you put here. So, here you have choose template. And you have a huge selection of templates, that you have on your website or you can create any one. I have premade one  template. Okay, I show you creating simple template with a menu, but let's try and insert something, something more complex and here, like a form. I hope this, this must be a contact form. Something like that. But when creating this template, you have to worry about the layout, that you are creating. Let's just go to the style. In the style tab you can actually make this panel wider. Like this. So, the layout looks a little bit better. So, as you see here this is, okay, hold on. This is a hamburger panel. Once you click on it, you open pretty much. Any type of content, you could put any type of content in here, because it is all editable through the templates. A pretty nice thing. And let's go back and just select, where is that menu template, that I have created. There it is. So, it could be either menu or something more creative, something more interesting, interesting. So there is the menu and here, so it looks a little better. Let's make it a little bit more narrow. So, it looks nice and clean. So this is really suitable for more creative designs. If you want to make your header really minimalistic tiny logo here, and tiny  hamburger menu here. And this wide, this not really wide panel, sliding in looks really clean, looks modern. In the settings we can change this side. So here we have the actual hamburger. This little hamburger icon. And we want it to slide from the left, so it is not cover the actual Icon. Something like that. And you could also change the style settings of the table. Oh sorry, not the table, of the panel, and of this icon here. You can change this style settings, the typography settings, the normal stuff in, align it and remove the text. So, it is just the icon. Something like this, which already makes your header look a lot more creative. Plus it saves some space in the header, it makes the page more clean.

And let's delete it. Let's delete it and proceed to.. Let's scroll down “Navigation Menu”. Navigation menu is pretty much the same thing that you have in Elementor Pro set. But it is a little bit different in settings, a little bit different in the layout here. Okay, there we are. Let's choose this menu. Also change the layout horizontal or vertical. The look of the drop-down icon, alignment. The mobile trigger. Here is no setting for the breakpoints. And we have the mobile menu layout. And let's see what that is. So, on mobile... Let's see how it look on mobile. Let's align the icon here. So, there it is.

Later we gonna get back to editing the header layout on mobile devices. So, do not really, do not mind that now it kind of looks weird and it doesn't really look it. We are gonna get back to it a little bit later at the end of the tutorial. This is the last section of today's video. We are going to be creating the responsive headers.

For now, let me just, just what. So, once you click on it, you here it opens in the drop-down. But there is also an option to make it open. Okay, not this one, because default is obviously the full width. The full width, yeah. So, like this.

So, you also have sort of a sliding panel. Slide from the left side, or slide from the right side. It is gonna be a similar layout, but it just gonna be sliding  from the other side. So, in here the drop-down menu also works pretty fine. So, this was the, the mobile trigger. How it is called, how it is called here in my water. I am sorry. And yeah, I have template monster mug.

And what should be done..Let's style it, let's style the header, the header menu. So, we can proceed to creating sticky headers. I hope you guys are not bored with this Jetblocks overview. If you are just let me know in the live chat, just talk to me, talk to me in the live chat, please. So, what we can do here. Let's change the typography settings. So it looks a little bit better. Let's do something like that. Make it bigger. Then change the weight. So these are the normal settings, that you usually have in pretty much all of the modules on Elementor. So, and also the hover effects are here. They are a little bit different from the ones, that you have in the default, default navigation menu widget, that you have in Elementor Pro. They are a little bit different. But here there is also a hover effect. Right, let's not edit the drop-down menu to not spend too much time on it. And there are pretty much set. Let's now update. So our progress is saved and if we now go to the homepage we are gonna see, we are gonna see this header applied to our homepage. Let me just go back here and see how it looks on our page.

And the next section, the next step in this tutorial is gonna be finally creating sticky headers. That is gonna follow you as you scroll down the page. And let it load. Not really good on doing this. So, here we are. Oh, of course. So, we have updated and since we have. Okay, we didn't align this navigation menu. Okay, this is my bad, this is my bad. I do align the navigation menu or pretty much any other widget vertically just go to the settings of the column. Click on this grey thing here and in the vertical line select middle. And you see just jumped down a little bit. And it is now aligned vertically in your section, according to the height of the section. So, now, let's, don't pay attention do this. I know it's ugly, but sorry.

So, now as we scroll down nothing follows us. So we have pretty much thing, and an empty thing here. Alright, so what should we do here, how can we make this section sticky. Let's see two ways of doing this.

The first way is go to “Motion Effects”. And here we gonna see the sticky thing right here. And we select “Top”. “Bottom”.. You maybe need the bottom option, if you create sticky footers, which is also an interesting thing to create. Sticky footer.. Can you imagine a sticky footer? But actually it would depend on the type of the layout that you create. Sometimes you might need it. Footer it is gonna stick here in the bottom as you scroll down the page. So, why not. So, stick it on top. I select the devices. Usually you want the desktop only, because it might act a little bit unpredictable on mobile and on tablet. And maybe on table, but not mobile for sure. And “Offset” is by how many pixels you want it to be. Like moved, not meaning moved as a scroll down the page, but move on the layout.

Let's just, let's add some values here. So something like that. So, it is not gonna be at the top of the page, but it is gonna have some space above it, and it is gonna to have some space as you scroll down the page. I have no idea why you might need this, but it's, it's a kind of fun that that there is in this option. Let's go back to the zero. And the “Effects Offset” isn't determined at which point along the page, on which point is you scroll down the page.  The effects are going to be applied. What effects? The effects that you add with “Custom CSS”. So, this option is gonna work if you use any custom CSS styles. Like maybe changing the transparency, but we are gonna talk about it a little bit later.

We are gonna talk about the way of changing the transparency and color of your header. For the users who do not want to really deal with any CSS code or do not, do not know how to do it, or do not want to spend time on it, we are gonna have a look at the other way to do it without any custom CSS. And where are pretty much set, as you see here, as you scroll down we can already see. Like you can see through this header. It means that it is transparent. And since it is transparent what we need is some background, because we don't want our header to be transparent. As we scroll down the page we do not want to see through it, because it is gonna be not really comfortable to read it. It is not gonna be a really good look. So, in the “Background Type” let's select the white color. And now it is gonna give the background to this section. Meaning it is  gonna give the background to our header. Now we have a background. Now looking pretty nice. And as you see only this section that we have applied. Or is it an “Advanced tab”, that we have applied the sticky effect to only the section is moving the breadcrumbs section stays here. It doesn't move anywhere. So it just really depend on what parts of your header you want to move along site. And if you want to, if you just want to make any section sticky, but you want the breadcrumbs to also be in this sticky header, let's just, let's just add it somewhere to this section and this is gonna do the job. Maybe somewhere underneath the logo. Okay, let's not. Okay, here we are. Something like that. If you want to get something like that in your sticky header, just go for it. But it is not really recommended, because you, you usually want this part of the header, that is sticky, to be really minimalistic. So, it doesn't I, accidentally deleted the breadcrumbs. But whatever we are not gonna use them, because when you want the header to be sticky, you want it to be really minimalistic, so it doesn't distract the user from the actual content of your page. So, for now we are pretty much done. Now let's update and we are gonna go to our homepage to see the result of the changes that we have made. So, now we are in the homepage. Let's refresh and let it load.

Bye! And my coworker is leaving, so just waving him.

Okay, so guys, let me know how you are doing in the live chat. And if you want me to like go deeper into some topic and really elaborate on some functionality, that I am talking about but not going into detail, just let me know in the live chat, if you have any questions or any suggestions for me to show you on this live stream.

And this is scroll down, there is the header. Oh, we could add some shadow, some shadow under it, so it's a little bit more visible on white areas of our website. We are gonna do that a little later. Let's do it later. Let's just back to Elementor and do it. But as you see here, this is working pretty nice. It has done the job, here we are.

And now let me show you one more little thing, that you could apply. And this is called, I have two of, I have two of these tabs, because I have accidentally, I have also the plugin, that goes with this functionality and I have also installed the free plugin that has this functionality, so it kind of, you know, layered on top of each other and just don't pay attention to it. Normally it doesn't happen in your own website. That will only be one tab, that that is gonna be called “Jet Sticky”. So, the sticky section. Let's just switch this function off. Like toggle it to none. And in the “Jet Sticky” tab, if you enable the sticky section option, it is gonna here, we are gonna see it, but it is actually gonna make your section here that is you select, this section is gonna make it sticky. And what is nice here is that you can change the width of this section. You might want to change the width of your header. This is pretty rare case, but if you do, you have this option. You can change design index. So set it to the highest, the highest value. Why you have these settings here like width, “Z-index”, because you can actually download and this plugin. It is a free plugin and let me actually, let me share it in the live chat. Give me a second, I am going to share it in the live chat. This is for plugin that you can download and you can install it. Okay, sending a link.

It is for plugin on the, and even though it says that it has not been tasted with the latest, the freshest versions of Elementor, it is still, it is still works. It is still works pretty well, and the developers are.. they were really busy creating the best updates for their plugins. So, they are gonna get back to this plugin. I have contacted the developers, and they have confirmed that in a couple of weeks this plugin is gonna be tested on the latest version of WordPress. But I have tested it on normal website and this plugin works perfect. Even though, even though it hasn't been tested, it works perfectly. So, do not, do not worry about that.

So, okay, okay. So, I have shared, I have shared this plugin in the live chat. So, go check it out, if you want to.

For now, what should we do?! We should get back to the section,  “Sticky Section Style”. And here is where you can change the color of your header on scroll. Let's see how we can do that. You can change the duration of the transition. For example, before your header was transparent, like here, it was transparent. If you have a really nice background image and your, you had a elementor transparent header, so you didn't have any background color for this header section, like this. But as you scroll down you want to actually have color, so it is visible on top of the homepage. This is where Jet Sticky plugin allows you to change the background color. So this is where you do it. You just set it to white. It could also be a gradient, or an image. And let's add a “Box Shadow’. A really subtle box shadow. Something.. something like this. Okay.

For now it is not possible to preview, as right here an Elementor editor. But it is going to be changed in the future, in the nearest future. It is gonna be updated and it is gonna work perfectly and you will be able to see the changes that you were making with the Jet Sticky plugin. And in the “Transition duration” you can increase the duration of the transition between this static header that you have here and this will be scrolling down. It will be a slow smooth transition to the header with color, in our case it is transparent and it is gonna to become the header with the solid color in the background.

Now let us update. And then what I am going to do. Okey, it is already updated. Now let me open any window here, where we gonna load our homepage. Okay, hold on and stick it in here. I am actually using incognito window, because this.. let me explain. Because this bar here, sometimes it doesn't work properly with the sticky headers, sometimes it just, the headers doesn't stick and it wears me out. So I'm, I have to use  the incognito windows. So where I don't have this admin bar WordPress to actually preview my sticky headers. Yeah, it is kind of, sometimes kind of nice really, a comfortable thing. But well, yeah, it happens.

So, here you can see the transition between the static header and as it becomes sticky, as it gets its color, as it gets its shadow, and it's pretty smooth. So this is a nice trick, that you can use in order to make your header sticky and in order to make them change their color, and opacity on scroll. There we are.

Now let me check the live chat really quick. Okay, if you guys want to, if you guys have any questions just let me know.

We are getting back to the header and what I wanted to show you is.. I show you creating responsive headers. And if we have some more time. It's actually, it has been an hour already. But if we have some more time, we are gonna proceed to creating footers. I am just gonna go over it really quickly, because it is not really a big difference between creating headers and creating footers with Elementor Pro. The intuitive is pretty much the same. Here you get  the Elementor editor, but we are gonna have a look at the conditions and at the widgets, and how you could manage the layout of your footer a little later.

So, here we are back in the Elementor editor and now let's actually have a look at the responsive menus. Do, as you set it to tablet it looks pretty okay, but once you set it to mobile. Let's have a look at the example of the mobile layout. When you work with the tablet layout you can do the same thing, you can do the same and apply pretty much the same workflow. And here, now they have stacked on top of each other and does not really good look. It is a great technique, the great thing, the great method to adjust the sections on mobile layouts, that Elementor has implemented. But in the header you don't really want this. You want this on your pages, where you have sections, and they stack on top of each other. So, the viewers keep looking, keep scrolling and keep seeing all the content, that they see in the desktop version. But the columns are stuck in a comfortable way, so there is a still nice  and good looking layout. But in the header like really, we don't need these, these two sections to be... sorry, these two columns to be on top of each other.

So, what we do here is we go to the section. Why I keep calling this section??! To the column setting. This great thing over here and we have to change the column width. First measure that this a little phone icon is highlighted. And let's set it to, let's set it to.. I don't know. Okay, 80. Let's set it to 80. And let's go to this guy here. We are okay with the widget. We need to go to the column settings and do the same thing here, and then set it to 20. So, now we have again, we have two columns in one section as we do on the desktop layout. And here you have this logo, you keep just have this logo in the same place.

If you want to change it, if you want to remove your logo from your mobile version of your website, just go to the settings of the widget. Scroll down, and find the responsive tab and simply click “Hide on Mobile”. And you are gonna see your logo on your mobile layout. This is pretty simple. This is you know, this work flow that you can hide sections, you can hide columns and widgets on different types of devices.

Okay, my another coworker is leaving. They have left me alone here. All alone, only you guys. Okay, I have one, I have one message in the live chat. It is saying that the sound is not good. Okay, what can I do to make it better. I'll just try and sorry, I just try and move the, to make a little bit closer. Okay, might be better, just is this better, just let me know in the live chat. Okay, I'll try, I'll try to maybe stay closer to the microphone. So we can hear it better. Okay really, sorry, for the inconveniences. We are gonna improve on it, because  this is just our second live stream, only the second live stream. We have done another one last week, and we are planning on doing it quickly. So, just let me know what.. let me know what we could improve in our webinars, in our live streams to make the quality better. Maybe you want the video quality to be better, maybe the sound quality to be better, maybe you want.. maybe you want me to explain things in a different way. Just give us your feedback, give us your feedback, so we know how we could improve, how we could make these live streams better for you, so they bring you even more value. Okay. I thank you so much for the feedback, and I am really curious what 70/30 means. So, excuse me could you, please, clarify what`s 70/30. It is just not really clear for me. But if you could, if you could make it clear for me, I would be really grateful. Thank you.

So, we are back, back here to the mobile layout. Columns, yeah, yeah, yeah, 70/30, thank you, thank you for helping me out. But, yeah, I did 80/20, but it also, it also worked fine, didn't it? Okay, okay, we could try, I could try 70/20,why not? It could also be. Yeah. Oh, hold on, how can we, all right. Let's increase the size of this one, and go here, and do 70. 70. Now, we see it  squeeze a little bit. I think it's 80/20 was a little bit better. Yeah, it's fine.

Okay, but I still want and tried it, why not. Just tried it's out. It could work, if we had a smaller logo, a little bit smaller logo, but it is kind to big. And actually, actually what you could do is select different logo widgets for a different layouts. Let me show this for you. Just, just have this idea. Where is it?!.. “Site Logo”, let's drop it in here. What's great about this logo widget, okay, come on...What's great about this logo widget is that you can select the logo, the image of the logo in the actual, like from the media library in the actual widget that you are using. When with the logo widget in the Elementor Pro in the default site which is not possible, but here you can create this smaller version of your logo like here, like I have the bigger version, I have the smaller version. So I could this still display my logo on the mobile layout, but it is more minimalistic. Something like this. I just really hope it's smaller, than this one. Okay, is it? It should be. Yeah, it is smaller. So, this is the widget that we are gonna use for the mobile layout. And if we go to the settings of the widget, just click on the widget here. In the “Advanced tab”, we go to “Responsive” and we switch it off on desktop, and on tablet. Which means that this logo, this tiny logo, this smaller version of our logo is gonna be visible only on mobile devices. Like that, see. Looks a lot better than with this giant thing here, right?

Okay, so let's now see at this... I think what we can do with this tiny thing. Let's click on this widget. On the widget, not on the hamburger. So, this is the navigation menu. This is what your navigation menu turns into, when you resize your layouts to the mobile version of your website. And this is where you have your menu, like it slides from the left. We have already have a look at the types of here, the types of mobile menu layout. So, you have the hamburger and you have the actual menu sliding from somewhere, from the right side, from the left side or becoming a full width menu.

Give me a second, click. So, it just now looks like a normal drop-down. But also, if you don't want any drop-downs on your mobile devices, but you have, you want to have a drop-down on the desktop version of your website, there is a workaround and you can apply the same workflow as we did with the logo. We have two different logos here, but only one of these logos shows in each version of the device. The each version of the website for a specific device. We can do the same with the navigation menu. Let's do that. Let's just, okay. Let's just go to the settings of this widget..”Advanced”. So, this is the menu here that contains the drop-down. And what I want to do is to hide the menu with the drop-down. I don't want any drop-downs on the tablet and mobile. No drop-downs. So, what I do here.. Hide on tablet, hide on mobile.. Then duplicate this widget. It doesn't really matter that it's stack on, stacked on top of each other. It doesn't really matter that it looks weird, the layout here looks something like, you know, something, something really weird. But it doesn't really matter, because only one of these two, only one of the elements in each pair is gonna show on each type of device. All right. So, let's edit this second navigation menu. We have just duplicated the first one. And let's go to the “Select Menu” option. And I have two menus here. One is a drop-down. And the second one I have created another menu, a more minimalistic one, with less items, and with no drop-down. Let's see it. So, only four items. And then we go to “Advanced”, and applying the same workflow. But “Hide on Desktop”, and “Show on Tablet”, and “Show on Mobile”.

And I am trying to keep closer to the microphone, so let me know if the sound is better, if the sound is any better. And I really hope we can improve this. I hope we can improve this on the next webinar.

So, there we are. So, here is the layout. You know, don't, don't really might this layout here, because we are not doing styling. We are doing only the functionality. But you can, of course, you can adjust all the paddings, all the margins, you can change the layout here. It's, it's all possible in the style tab. But we are not having a look at the style settings, we are only doing the actual functionality. So, now responsive headers we are pretty much done. And if you have more complex headers, like, let's see. Let's see, if we can get back to the desktop mode, and add a little bit elements. Let's add new column, and let's set on the right I want some social icons. I want some social icons, I just want to show you that you can hide the elements on the mobile, the mobile version of your website at all. And so, you do not have these elements at all. And  when in desktop mode your layout is more complex, you have more elements, but on mobile these elements disappear. Magically disappear from your header.

So, let's go to the settings of the column. “Vertical Align” – “Middle”. Let's give it a little bit of styling settings, just a little bit. A little bit custom colors, a little darker. No, hold on. I want to do.. I want do something different. Let's, let's just do that. So, it looks more minimalistically, a little bit more minimalistically, a little bit more tidy. And needs, now.. I can hover the “Primary Color”. It is gonna be no color at all. And the “Secondary Color” the red. So, like this, the hover animation. I am not gonna really bother. So, here we are, the social icons. And say I want these social icons. So let's see. This is the layout of our.. for what.. of our desktop header. So this is what we are gonna see on desktop devices. So, logo, navigation menu, this ugly drop-down, and these social icons.

Then say I want to hide this social icons widget on tablet and mobile. What I do is go to “Responsive”, “Hide on Tablet”, “Hide on Mobile”.. Super simple, easy. We are still gonna have it on desktop, but if we go to tablet... Okay, hold on. Responsive visibility will take effect only on preview or live page, and not while editing in Elementor. Weird.. Let's go to mobile. Maybe something is broken. Okay, mobile.. it works okay. On tablet, let's see. “Hide on tablet”... On mobile it still works. On tablet it is not really  show you much differences, it is not really hide elements. So, probably, the tablet version of your website you are only able to preview while, while do it in a browser probably. And while using the “Inspector tool”. It is that helps you kind put your page in a mobile layout. So, probably this is where you able to preview it, but not in the Elementor editor, because responsive visibility will take effect only on the preview or live page, and not while editing in Elementor.

So, okay, okay. I am good with that, so this is what our header looks like. It is a really nice, neat, responsive, absolutely, 100% mobile friendly header. Looks like super ugly, when it is in the editing mode. Who cares I'd gonna be nice and neat in the actual website. Now, let's turn off all of these settings, that we don't need right now for the preview. Like I wanted to turn the “Jet Sticky” off. Because now I wanted to show you how it looks on different devices and the actual preview. Let's update the page. We are now updating the page and we are coming close to the end of this webinar.

It has already been an almost an hour and a half. I hope you guys not too tired. I am a little bit. Too much talking for me. So, we are done. Let's then go back to the homepage and see this header. I hope it all works. It has to work, I know it works, because I have done it before, of course, many, many, many times. So.. so, so. This admin bar, the top. So yeah, we could adjust the padding, but who cares really. Yeah, we could just the padding, so it's all nice and aligned. But as I have said I decided not to bother with the settings, with the style settings, because who cares about the style settings when we have the actual functionality to look at.

Okay, whatever, we could.. You can change the padding of this header later. Or should I do that right now. Sure, okay. So, what you do is just adjust the either padding, or you could go to the layouts, go to the “Height” settings, and then adjust is over here. If you want to make it bigger or smaller, just to your taste. Then we are back to the homepage. As you scroll down it is not sticky, because I didn't, I turned it off. And  didn't want to pay too much attention to it right now.

Now, let's go to the “Inspector”. So we can preview. Give me a second. So, you can preview these layouts on tablet, and on mobile devices. So, let's click on this toggling here. I am using Chrome, so if you are using a different browser the set of tools might be a little bit different. So, we go to the IPad. So, this is the normal tablet layout. And what we could do here is to go to.. Okay, I see I already see what's wrong. What's wrong in there. Okay, too bad, we don't really see. Oh, we actually do, what we can so here is try and adjust the width of the columns for the tablet. Let's do 60. And for this one let's do 40. For this column. No? Doesn't work?! What's wrong.. What's up?! Okay, maybe we should do a little bit less. It seems like we cannot really preview anything in the tablet mode. Oh, okay, I see. Maybe this is the problem. So, if we set 30.. if we... if we set 30% for each column, it has to stack them in, in the row. But it doesn't do it for some reason and it seems like the preview do the tablet devices, it's not really here. But we can change the order, so the preview should work. Okay, let's not focus on that. Let's not it focus on that..

What we have here is just set the values that I find to be suitable. And it is gonna be 60 and 40. 60 and 40, and we are going to update, and we are gonna it go to the homepage again. And  we are gonna to refresh. What I am waiting for, we are going to refresh. And we are gonna to see the tablet layout once again. I hope that this time it works and it looks better than it did. But it might also look worse, a lot worse.. Oh, good, good, good. So, I got the percentage correctly, yeah, good thing. All right, all right, all right. So this was the IPad. So the tablet device. This is was the layout for the tablet device. But as you see here, we have, we have chosen the menu with no drop-down for the tablet devices. And as you see here, no drop-down. Then we go to the, let's that Pixel2. This is the mobile layout already.  And yeah, we had to center, we had actually center the logo. So it is on the same level, so aligns according this hamburger menu. Forgot to align it once again. And this menu works. Okay, looks pretty neat. And let me just.. so vertical line middle update and refresh.

So, we are approaching the end of this webinar, we are approaching the last steps in this live stream. Really the last thing that I wanted to do and I hope we have some time for doing the footer layout as well. So, as I have updated, now it is nice and aligned. So, this is how the mobile layout looks. So, no extra elements, only the needed things here and it's adjust to the mobile layout perfectly.

Okay, and as I have said I have used the widget for the header, that we have in Jetblocks plugin. But what of we use the standards Elementor logo widget. Let's delete these, delete them. And see if we have it. Oo it tiny column here, the site logo. Let's drop it in there. Can I? Yeah. Seems like it is there, it is there right now. Seems like we have, no, I didn't. Okay, let's get back to the desktop. Why am I still in the tablet mode?!

Okay, probably, probably live streams, probably live streams longer than an hour is already an overdue. Really, it is, it's probably too much. So, if you guys are watching right now, let me know in the live chat. If you find the webinars like too hours long, or something like that, of you find that too much both for me and for you, of you find them to be like overshoot, just, just let me know in the live chat. If you are gonna watch it in two hours webinar or not because we are approaching, we are approaching, that it milestone like right now. An hour and a half.

So there is this widget and all you can do is.. yeah, what you can do here is you can use this. Okay, let's set the vertical align, yeah. You can use this widget for the desktop. Let's say widget “Advanced”.. “Responsive”, “Hide on Tablet”, “Hide on Mobile". No, hide only on mobile. Then duplicate it, change the image size. Let's do something really, really tiny. As you remember the standard Elementor logo widget pulls out the logo from the global settings, that you set. Okay, that you set in the Customizer. So, width and height. Hmm, what, what if we do, like.. I am going to try and guess the proportions, because.. to my shame. To my shame I don't really.. Oh, I meant 100, excuse me. I meant 100. And it seems like.. Or doesn't really resize the image, it just crops it. It doesn't resize the image, so you cannot. Do we have these?! Yes, oh, I was doing a really stupid thing here. Because here actually in the style tab we have this width slider and if we go to tablet, we can make it like this big. Or we can go to mobile and for the mobile device we can make it even smaller like that. So, this is, so in this case we do not really need the second widget. We could, we could really use the same widget. Genius! I am just… seems like I am learning alongside you guys. I am, you know, I know a lot things about all that, but once you start doing it yourself, once you start applying some techniques and practice, it all turns out to be super fun and interesting. And you can learn a lot of things yourself, by just showing them to other people and trying out different approaches to the same problem.

Okay, here we are. So, I have set the different width for different devices. As you remember the default Elementor are logo widget pulls out the logo from the global settings, while Jetblocks works like the image widget, where you can select the logo for your website from the media library. And enough of the headers. We are not going to update. So updating... On our homepage. Let us, it slowly, a little bit slowly, because we are streaming, because we are online on YouTube. So this is why the connection is gonna be a little bit slower. So, and we have a footer. It is also I have no custom footer templates. We are gonna have a look at the footer really quickly, like 10 minutes max, like I really want to wrap this up with some nice footer template.

So, this is the standard thing that you get, if you do not use any footer templates with Elementor Pro. We are done with the headers and we are going to now exit to the footers. And here we can create our first footer, add new footer, here we leave it as footer. Footer for tutorial…And click create template and while it is creating. Let me just a few curious.

What I wanted to do is to share in the live chat, what theme I was using in this, in this video, in this live stream. I didn't pick this theme, because of some of its qualities, because a lot of the templates like most of the templates, I see 90 percent of the templates… Why am I saying templates?! WordPress themes that you find on Template Monster are really, really good. But I picked it, because it looks nice and it has Jetblocks plugin in it, it has JetElements plugin in it, JetTabs, which helps you create really beautiful layouts. And the layout of this theme, the layout of the homepage of this theme was created with the help of JetElements plugin. And you can see it looks very good. It has a lot of really good elements, really good looking elements, really different types of content. And it offers us to use the template again. You could use the template, but I am not using templates here mostly, because I want to show you the way how to create custom headers and custom footers. This is nothing bad in using and using up premade templates. Especially, if you want to save time, it is a great help. But I am not using any. I actually premade the footer myself. I used a really minimalistic set of elements. Let me look. Okay, hold on. Maybe let me scroll. Okay, all right, I might have deleted it, accidentally. Yeah, I might have deleted it. Because, you know stuff happens. So, here this section. Creating a new section, stretch it. Let's just do it really quickly. What we could do for our footer, it's usually the copyright notice, right. So, you give this “Text Editor”. You use the text editor. Let's just drop it there. Let's create a really minimalistic, really simple and basic footer. So, you only have the copyright notice there, and the social links like we have in our header. And it is a little bit slowly, because of this stream, as you already know. So, so here we have the text editor. We have added the text editor. And what am I doing is just simple copy this, copyright thing and be back in our footer editor, paste it. Add it the typography really quickly. Just gonna go over it, really quickly. Just apply some really minimalistic changes to it. So, and this would be here header.

Essentially, the process is pretty much the you have with the footer. And in normal practice is to add menus to your footer. Menus meaning the vertical menus with... Okay, let's me show it. Vertical menus.. So the person that has scroll down to your page could navigate to any place on your website, without the need to scroll back up in order to access the elementor transparent header, especially, if you don't have a sticky header on your website. The navigation menu, dropping it here.

And I just want to, I just want to want to, I want to want to?!, I just want to let you guys in the live chat. I should want to let you know, how you find this live stream, if it is too long, if you find the video quality good enough, if you find the sound quality good enough and if you find the entire format of me sitting and doing some weird things in Elementor to be a good way to spend time gist watching this live stream. So, simply, give us, please, give us your feedback. It is gonna help us improve this live stream in the future. It is gonna help us a lot, because we are planning on doing this, planning on doing this often, since we ourselves work with Elementor Page Builder a lot. And we have a lot of ideas, and a lot of problem tips to share with you. So, just let me know how we could improve these tutorials in the future.

So, "the sound was good, good stream, thank you". Oh, it is so nice to see comments like that. Thank you so much that you stay to the end. Thank you for this feedback, and we are gonna to, we are gonna to do better, we are gonna to improve, we are gonna to try and find new ways to bring more value to you, guys. Thank you for watching.

And this is how you create a verticals menu in the footer. You simply add the navigation menu that you have in the standard site in Elementor Pro. You change the layout vertical. And there we have this menu. And so this is in the footer and as the person, as your visitor scrolls down the page, they can access any page that you have in your menu from the footer, without the need to scroll up. So, let's just stop right here with editing the footer layout, because it is nothing new. If you know how to edit the header, you understand the logic behind creating custom features.

And since it has already been an hour and 40 minutes. I am going to just show you the conditions for the footers, which are pretty much the same that you have, in the case of headers. And we are going to wrap this up on a really friendly note. I am just not thinking if I want to share any more links with you, if I missed something. Okay, so, include entire site, the same way as with the headers. It was like those options that are include. These are the options, the pages, the parts of your website on which this footer, that you are creating or header. In case of headers is gonna appear. So, it appears on the every single page of your website, if you set entire site. But then you add condition and you set include, which means that you want to.. Oh, I am sorry, excuse me. You set exclude, which means that you do not want this footer to be visible on these pages of these parts of website that you select here. Either archives, which are the archive pages for post, for your blog, for categories for products, if you have products, for the type, for a post types that you have on your website, essentially. And if you say exclude, this footer is not gonna be shown on any of these archives, these archives, if you set all.

Okay, I excuse me. It seems like an hour and 40 minutes a little bit too long. Even for me to keep talking, but okay. I think if we keep doing this every week, I am gonna get used to it. So, we are gonna see.

So, what was it talking about. So, you can either select all the archives or you can select one type of archive, and then it is not gonna be shown on this particular type of archive . Or of it is singular… you could select either all singular. Singular like you have here pages, you have here posts, like let's see post. It is not gonna be shown in a posts or we can start typing the name of the post here. Or it is not gonna be shown on this specific page and if we start typing..

I don't have really many pages, so lest looks that poor. We select the contacts page and we click add condition. And it means that this, now this page, the contacts page is gonna be exclude from the list of the pages on which this footer is going to be shown.

This is the great tool because the same way as we custom elementor transparent headers. It allows you to create different types if footers for different parts of your website. So, it is a great tool. It is a lot of power, a lot of customization options, and a lot of freedom for as a designer, as a website owner, whatever, whatever really kind of website you want to create. It gives you a lot of possibilities. This exact thing here that you can include, exclude specific parts of your website from the list of the pages on which your headers and footers are going to be shown. Then save and close. And we have applied this ugly footer to our website. And this is pretty much it. Should I get back to the homepage, to wrap this up. Let's do that.

So, we are back here, this header is not. I am not really proud of the design of it, but excuse me, because I was really focused on the explaining the functionality of the elementor transparent header and footer Builder, which is called Theme Builder. And, again, if you want to access the library of the header and footer templates, go to the Theme Builder and there under the Elementor tab, on the left SiteBar, and you are gonna find all of the templates, the template library essentially, that you need to create custom headers and custom footers and also custom icon templates and single page templates. And if you have just joined in, just go to the beginning of this stream, where I am showing how you can access the theme builder in the Elementor.

So, we are pretty much done with this tutorial. And I hope it wasn't too long for you guys. And I hope you find this tutorial useful. I hope you find some useful information, and I really hope this live stream has brought a lot of value to you and to your future projects. And of you have any more requests or suggestions for us, what other kind of stream we could do the next time, the next week, because we are planning to do it quickly. Just give us your feedback, give us your suggestions and help us improve these live streams for you and for the Elementor and WordPress community.

So this seems like, it seems like we are done. We are with this stream and it seems like it is time to go offline. I thank you so much guys for staying the end, and I see you next week. And we are gonna announce the topic for the next webinar on Facebook, on Instagram, just if you follow us anywhere on social media channels. You are gonna see the notification about the next stream and the topic of next stream. And if you have any suggestions and recommendations let me know. And I see you guys next time.

Thank you for watching! And bye!


How to Sell WooCommerce Virtual

How to Sell Products on WordPress?

Elementor From A to Z: Sheer Selection Of “How To” Tutorials

57 Best eCommerce WordPress Themes: Free and Paid

Best Maintenance Services and Chat Plugins for WordPress 2019

How to Increase Conversions of WooCommerce Product Pages

How to Start a WordPress Podcast Website: The Step by Step Tutorial

Don’t miss out these all-time favourites

  1. The best hosting for a WordPress website. Tap our link to get the best price on the market with 30% off. If Bluehost didn’t impress you check out other alternatives.
  2. Website Installation service - to get your template up and running within just 6 hours without hassle. No minute is wasted and the work is going.
  3. ONE Membership - to download unlimited number of WordPress themes, plugins, ppt and other products within one license. Since bigger is always better.
  4. Ready-to-Use Website service is the ultimate solution that includes full template installation & configuration, content integration, implementation of must-have plugins, security features and Extended on-page SEO optimization. A team of developers will do all the work for you.
  5. Must-Have WordPress Plugins - to get the most essential plugins for your website in one bundle. All plugins will be installed, activated and checked for proper functioning. 
  6. Finest Stock Images for Websites - to create amazing visuals. You’ll get access to to choose 15 images with unlimited topic and size selection.
  7. SSL Certificate Creation service - to get the absolute trust of your website visitors. Comodo Certificate is the most reliable https protocol that ensures users data safety against cyber attacks. 
  8. Website speed optimization service - to increase UX of your site and get a better Google PageSpeed score.

MonsterPost Editorial

Posting contributed articles about the major web design highlights and novelties. Come across a handful of useful tutorials and guides shared by experts in the web design and online marketing fields.

Get more to your email

Subscribe to our newsletter and access exclusive content and offers available only to MonsterPost subscribers.

From was successfully send!
Server error. Please, try again later.

177 responses to “How to Build Custom Headers & Footers with Elementor Pro [Free Webinar]”

  1. seo exeter says:

    Nibble Softwaгe Technologies іs ɑ renowned Seɑrch Engine Optimization Company in india and USA that offeerѕ affoгdable SEO Serviсes and Internet Marketing Solᥙtions too its international cⅼients.

    Take a look at my web blog – seo exeter

  2. Bunny Ears says:

    Link exchange is nothing else however it is only placing the other person’s blog link on your page at suitable place and other person will also do
    similar in support of you.

  3. bunny hat says:

    I like the valuable information you provide in your articles.
    I’ll bookmark your blog and check again here frequently.
    I’m quite sure I will learn a lot of new stuff right here!
    Good luck for the next!

  4. bunny hat says:

    You actually make it seem really easy along with your presentation however I in finding this topic to be actually something which
    I believe I’d by no means understand. It kind of
    feels too complex and extremely broad for me.
    I am having a look ahead on your next put up, I’ll attempt to get the hold of it!

  5. Appreciate this post. Let me try it out.

  6. I know this if off topic but I’m looking
    into starting my own blog and was curious what all is needed to
    get set up? I’m assuming having a blog like yours
    would cost a pretty penny? I’m not very internet savvy so
    I’m not 100% certain. Any tips or advice would be greatly appreciated.
    Thank you

  7. Great items from you, man. I’ve consider your stuff
    previous to and you are simply too excellent. I
    actually like what you have received right here, really like what you are stating and
    the best way through which you assert it. You are
    making it entertaining and you continue to care for to stay
    it sensible. I can’t wait to read much more from you.
    That is actually a wonderful web site.

  8. My coder is trying to persuade me to move to .net from PHP.
    I have always disliked the idea because of the expenses.
    But he’s tryiong none the less. I’ve been using WordPress on numerous websites for about a year and am concerned about switching to another platform.
    I have heard very good things about Is there a way I can import
    all my wordpress content into it? Any kind of help would
    be greatly appreciated!

  9. Greetings I am so excited I found your web site, I really found you
    by error, while I was researching on Google for
    something else, Nonetheless I am here now and would just like to say thanks
    a lot for a tremendous post and a all round thrilling blog (I
    also love the theme/design), I don’t have time to read through
    it all at the minute but I have bookmarked it and also included your RSS feeds,
    so when I have time I will be back to read a great deal more,
    Please do keep up the awesome work.

  10. 파워볼 says:

    Admiring the persistence you put into your blog and detailed information you present.
    It’s nice to come across a blog every once
    in a while that isn’t the same unwanted rehashed material.
    Great read! I’ve bookmarked your site and I’m adding your RSS feeds to my Google account.

  11. Right here is the right website for anyone who really wants to find out about
    this topic. You understand so much its almost hard to argue with you (not that I really would want to…HaHa).
    You definitely put a fresh spin on a subject that has been discussed for decades.
    Excellent stuff, just wonderful!

  12. It is in reality a great and helpful piece of info.
    I’m happy that you shared this useful info with us.
    Please keep us up to date like this. Thank you for sharing.

  13. Appreciating the hard work you put into your website and
    detailed information you provide. It’s nice to come across a blog every once in a while that isn’t the same
    outdated rehashed information. Wonderful read! I’ve bookmarked your site and I’m including your RSS
    feeds to my Google account.

  14. magnificent publish, very informative. I wonder why the
    other experts of this sector don’t understand this. You must continue your writing.
    I’m sure, you have a great readers’ base already!

  15. 블랙잭 says:

    May I simply say what a comfort to discover someone that really understands what
    they are talking about on the web. You definitely know how to bring
    an issue to light and make it important. A lot more
    people must check this out and understand this side of
    the story. I can’t believe you are not more popular given that you most certainly possess the gift.

  16. Keep this going please, great job!

  17. Fpkkec says:

    order imitrex generic – order sumatriptan 50mg pill buy imitrex for sale

  18. Yasal bahis siteleri bonus: En son aşamada ise almış olduğunuz ya da almaya hak kazanabilir ve maksimum para çekme alt limitine gelerek paranızı talep edebilirsiniz. adaxbet güncel adres yeni üye kazanmak adına resmen bir mecburilik olmadığı için, tek seferde verilecek maksimum tutar 100 TLdir. Hoş dite manzarası etkin olan bahis siteleri, para yatırma işleminde kullanabilirsiniz. Tamamen Türkçe alt yapılı bahis sitesidir. adaxbet de bu yazımız içersinde ininal kart kabul eden bahis siteleri, her şeye karşın etkisini günden güne arttırmaktadır. Sitede bahis ve casino cennetine giriş biletini alır. Genellikle deneme bonusu veren sitelera 0 çevrim şartlarını detaylıca öğrenebilirsiniz. Oran karşılaştırması uygulanan sitemiz de daha verimli bir proses yönetmek istiyorsunuz sorusu akıllara gelir. Unutmayın ki en mühim püf noktalarından bir tanesidir.

  19. I all the time used to study post in news papers but now
    as I am a user of internet thus from now I am using net
    for articles or reviews, thanks to web.

  20. Exxenbet sosyal medya hesaplarını takip ederek hemen bütün bilgilerden haberdar olabilir ve bütün içeriklerine itimat edilir şekilde ulaşabilirsiniz. Sosyal medyanın yanısıra aynı vakitte sms, mail, whatsapp hattı, telegram ve canlı destek hattı üzerinden bahis sitesi ile rahatlıkla iletişime geçebileceksiniz. En aktif etkileşim tekniği canlı destek hattıdır. Canlı destek hattı sitenin ana sayfasında yer almakta ve kullanıcılarına hemen geri dönüş yapmaktadır. 7 gün 24 saat hizmet yayınlayan Exxenbet , kullanıcılarına süratli geri dönüşler yaparak bütün problem ve şikayetleriniz ile ilgilenmektedir. Canlı destek dendiğinde akla gelen üyelere vermiş bulunduğu destek gelmektedir. Site içinde yaşamış olduğunuz bütün sorun, şikayet, tavsiye ve dileklerinizi canlı destek hattına bildirerek ayrıntılı hizmet alabilirsiniz. Para yatırım, para çekim, oyun seçenekleri, bonus ve kampanyalar, Vıp ve güncel adres bilgi kapasitesi gibi çoğu bahis içeriği ile ilgili ayrıntılı bilgi alabilirsiniz. Kullancılarının memnuniyetini odlukça önemseyen Exxenbet, üyelerinin problemsiz bahis hizmeti alabilmeleri amacıyla günün her zamanında ekibi ile sıkı çalışmaktadır.

  21. Bahis sitelerine son zamanlarda ilgi hayli artmış görünüyor. Tüm dünyayı sarsan ve halen devam eden Covid 19 salgını sonrası birçok ülkede ekonomik sıkıntılar ortaya çıktı ve insanlar artık yeni kazanç kapıları arama içine girdiler. Kolay para kazanma yollarının başında ise bahis ve şans oyunları yer alıyor. Dünya üzerinde milyonlarca insan bahis sitelerine giriş yapıyor ve buralara paralar yatırarak yüksek paralar kazanmak için uğraşıyorlar. Bahis siteleri arasında son yılların en çok kazandıran ve en yüksek bahis oranları bulunan bahis sitesi olan favorisen tüm dünyada yaygın bir şekilde kullanılmaktadır.

  22. Bahis oynarken yapmış olduğunuz bakiye yüklemesinin yanı sıra bahis siteleri doğrulusunda sunulan bonusların detaylılığı de ehemmiyet taşımaktadır. Şimdilik ilk defa bahis yapar iken elde edeceğiniz promosyon fırsatlarını tam anlamıyla kullanarak bahis tadını üst civarlara çıkarabilirsiniz. Şuan fazlası bahis sitesinde tespit edilen deneme bonusu ise yeni kullanıcıların dikkatini bir hayli çekmekte. Hem bahis firmaları hemde oyuncular doğrulusunda cazip bir bonus türü olan deneme bonusu bir başka ismiyle yeni üye olanlara verilen bir nevi test hedefli bonus ismidir. Şimdi ayrıntılı olarak deneme bonusu nedir bunu inceleyelim aynı vakitte deneme bonusu veren siteler ile ilgili kapsamlı bulgular sunalım.

  23. Thanks for finally writing about > Build Custom Headers & Footers with Elementor
    Pro | Elementor Transparent Header < Liked it!

  24. Spot on with this write-up, I honestly believe that this site needs much more attention. I’ll probably be
    returning to read more, thanks for the information!

  25. You made some good points there. I checked on the web to learn more about the issue and found most
    individuals will go along with your views on this web site.

  26. Heya i am for the first time here. I came across this board and I find It really useful & it helped me
    out a lot. I’m hoping to offer one thing again and help others like you aided me.

  27. Hello there! I just would like to offer you a huge
    thumbs up for your great information you’ve got right here on this post.
    I am returning to your website for more soon.

  28. hello there and thank you for your info – I’ve definitely picked up something
    new from right here. I did however expertise several technical issues using this website,
    as I experienced to reload the site many times previous to I could get it to load properly.
    I had been wondering if your web host is OK?
    Not that I am complaining, but sluggish loading
    instances times will sometimes affect your placement in google and can damage your high quality score if advertising
    and marketing with Adwords. Anyway I’m adding this RSS to my email and can look out for a lot more of your respective interesting content.
    Ensure that you update this again soon.

  29. 포커 says:

    bookmarked!!, I really like your website!

  30. Thanks on your marvelous posting! I quite enjoyed reading it,
    you might be a great author.I will always bookmark your blog and will come back from now on. I want to encourage that you continue your great writing, have
    a nice weekend!

  31. Why people still make use of to read news papers when in this technological world all
    is accessible on net?

  32. This piece of writing will help the internet people for setting up new web site or even a weblog from start to end.

  33. Hello! Do you use Twitter? I’d like to follow you if that would
    be okay. I’m absolutely enjoying your blog and look forward to
    new posts.

  34. My partner and I stumbled over here from a different web page and thought I
    might check things out. I like what I see so now i am
    following you. Look forward to checking out your web page for a second time.

  35. 있습니다 says:

    Hi, this weekend is fastidious designed for me, because this point
    in time i am reading this wonderful informative post here at my

  36. I think that what you posted was very reasonable.
    However, what about this? suppose you typed a catchier title?
    I ain’t suggesting your content is not good, but what if you added something to maybe get people’s attention? I mean Build Custom Headers & Footers with Elementor Pro |
    Elementor Transparent Header is kinda vanilla. You could peek at Yahoo’s home
    page and note how they create article titles to
    get people to click. You might try adding a video or a pic or two to get people excited about
    everything’ve written. In my opinion, it would make your posts a little livelier.

  37. Hi there colleagues, how is the whole thing, and
    what you would like to say concerning this piece of writing,
    in my view its truly awesome for me.

  38. I read this piece of writing fully on the topic of the comparison of most up-to-date and preceding technologies, it’s awesome article.

  39. It’s hard to find knowledgeable people about this subject, but you seem
    like you know what you’re talking about! Thanks

  40. 빅카지노 says:

    I’m extremely impressed with your writing skills and also with
    the layout on your blog. Is this a paid theme or did you modify
    it yourself? Anyway keep up the excellent quality writing, it’s rare to see a nice blog like this one nowadays.

  41. Hey are using WordPress for your blog platform? I’m new to
    the blog world but I’m trying to get started and create my own. Do you need any html coding
    expertise to make your own blog? Any help would be really appreciated!

  42. I got this web site from my pal who informed me regarding this
    web site and at the moment this time I am visiting this web page and
    reading very informative content here.

  43. What’s up, its pleasant paragraph concerning media print, we all know media is a impressive source of facts.

  44. I love your blog.. very nice colors & theme. Did you design this
    website yourself or did you hire someone to do it for you?
    Plz reply as I’m looking to construct my own blog and would
    like to know where u got this from. appreciate it

  45. 라스 벳 says:

    Excellent items from you, man. I have keep in mind your stuff previous to and you are just too excellent.
    I actually like what you have obtained here, really like what
    you are stating and the way in which in which you say it.
    You are making it enjoyable and you continue to take care of to stay it smart.
    I can not wait to read much more from you. That is really a great website.

  46. yesbet88 says:

    I know this if off topic but I’m looking into starting my own weblog
    and was wondering what all is required to get setup? I’m assuming having a blog like yours would cost a pretty penny?
    I’m not very internet savvy so I’m not 100% positive.
    Any suggestions or advice would be greatly appreciated.
    Appreciate it

  47. Hmm is anyone else having problems with the images on this blog
    loading? I’m trying to figure out if its a problem on my end or
    if it’s the blog. Any feedback would be greatly appreciated.

  48. Great work! This is the kind of info that are meant to be shared around the
    internet. Shame on the seek engines for not positioning this publish higher!

    Come on over and talk over with my website .
    Thank you =)

  49. It’s hard to come by knowledgeable people for
    this topic, however, you sound like you know what you’re talking about!

  50. Can you tell us more about this? I’d care to find out some additional information.

  51. It’s appropriate time to make some plans for the future and it’s time to be happy.
    I’ve read this post and if I could I want to suggest you few interesting things
    or suggestions. Maybe you can write next articles
    referring to this article. I desire to read more things about

  52. It’s very trouble-free to find out any matter on net as compared to
    textbooks, as I found this post at this website.

  53. Excellent post but I was wanting to know if you could write a litte more on this subject?
    I’d be very grateful if you could elaborate a little bit further.

  54. I’m amazed, I must say. Rarely do I come across a
    blog that’s both educative and entertaining, and let me tell you, you have
    hit the nail on the head. The issue is something which not enough folks are speaking intelligently about.

    I’m very happy I came across this during my
    hunt for something concerning this.

  55. I’m very happy to find this website. I want to to thank
    you for ones time just for this fantastic read!!

    I definitely really liked every little bit of it and I have you saved as a favorite to look at new information in your site.

  56. 벳 365 says:

    Wow, superb blog format! How long have you ever been running a blog for?
    you make running a blog look easy. The overall look of
    your web site is great, as well as the content

  57. what is botox for the bladder

  58. Hi there, I do believe your blog could be having browser compatibility problems.
    When I take a look at your web site in Safari, it looks fine however, if opening
    in IE, it’s got some overlapping issues. I merely wanted to give you a quick heads up!
    Other than that, fantastic site!

  59. Heya i’m for the first time here. I found this board and I find It really useful
    & it helped me out a lot. I hope to give something back and aid others like you aided me.

  60. Excellent, what a webpage it is! This weblog provides helpful facts to us, keep it up.

  61. 리턴 벳 says:

    It’s a pity you don’t have a donate button! I’d certainly donate to
    this excellent blog! I suppose for now i’ll settle for book-marking and adding your RSS feed to my Google account.

    I look forward to new updates and will talk about
    this blog with my Facebook group. Talk soon!

  62. Hello just wanted to give you a quick heads up. The text in your article seem to be running off the
    screen in Chrome. I’m not sure if this is a format issue or
    something to do with web browser compatibility but I thought I’d post
    to let you know. The layout look great though! Hope you get the
    problem fixed soon. Kudos

  63. Hmm is anyone else experiencing problems with the pictures
    on this blog loading? I’m trying to find out if its a problem on my end or if it’s the blog.
    Any feed-back would be greatly appreciated.

  64. Hey there! I know this is kind of off-topic but I had to ask.
    Does building a well-established blog like yours require a massive amount work?
    I’m completely new to writing a blog but I do write in my journal on a
    daily basis. I’d like to start a blog so I will be able to share my own experience and thoughts online.
    Please let me know if you have any suggestions or tips for
    new aspiring bloggers. Thankyou!

  65. botox in bladder side effects

  66. is dysport as good as botox

  67. You made some decent points there. I looked on the web to find out more about the issue and found most individuals will
    go along with your views on this web site.

  68. When some one searches for his required thing, so he/she desires to
    be available that in detail, thus that thing is maintained over here.

  69. where to get botox in your 20s

  70. Hi there, I enjoy reading through your article post.
    I like to write a little comment to support you.

  71. 벳 페어 says:

    Have you ever considered about adding a little bit more than just your articles?
    I mean, what you say is fundamental and all. But think about if you added some great visuals or videos
    to give your posts more, “pop”! Your content is excellent but with images and video
    clips, this website could undeniably be one of the best in its niche.
    Amazing blog!

  72. If you wish for to grow your experience just keep visiting this website
    and be updated with the latest news update posted here.

  73. Hi! This is my 1st comment here so I just wanted to give a quick shout out and tell you I truly enjoy reading
    through your posts. Can you recommend any other blogs/websites/forums that go over the same subjects?

  74. instagram ücretsiz takipçi

  75. instagram ücretsiz takipçi hilesi

  76. instagram ücretsiz takipçi

  77. pci 슬롯 says:

    Thanks for sharing your thoughts on 토토 하는 법.

  78. Heya i am for the first time here. I found this board and I find It truly useful & it
    helped me out much. I hope to give something back
    and aid others like you helped me.

  79. fm카지노 says:

    I like what you guys are usually up too. Such clever work and reporting!
    Keep up the terrific works guys I’ve you guys to our

  80. I am actually grateful to the owner of this site who has shared this fantastic article at here.

  81. I truly love your blog.. Pleasant colors & theme.
    Did you make this website yourself? Please reply back as
    I’m looking to create my very own site and would love to know
    where you got this from or just what the theme is named.
    Appreciate it!

  82. Its like you read my mind! You seem to know a lot about this, like you
    wrote the book in it or something. I think that you could do
    with a few pics to drive the message home a little
    bit, but other than that, this is fantastic blog.
    An excellent read. I will certainly be back.

  83. Terrific article! That is the type of info that are supposed to
    be shared across the web. Shame on the search engines for now not positioning this publish higher!
    Come on over and talk over with my site . Thanks =)

  84. My spouse and I stumbled over here from a different web address and thought
    I may as well check things out. I like what I see so now i’m following you.
    Look forward to finding out about your web page repeatedly.

  85. I am curious to find out what blog platform you are utilizing?
    I’m having some minor security problems with my latest blog and I would like to find something more risk-free.
    Do you have any solutions?

  86. Greetings, I do think your web site might be having browser compatibility problems.
    When I take a look at your website in Safari, it
    looks fine but when opening in IE, it has some overlapping issues.

    I simply wanted to give you a quick heads up!
    Other than that, excellent blog!

  87. Wow, this piece of writing is pleasant, my younger sister is analyzing these things, therefore I
    am going to tell her.

  88. Hey I know this is off topic but I was wondering if
    you knew of any widgets I could add to my blog that automatically tweet my newest twitter updates.
    I’ve been looking for a plug-in like this for quite some time and was
    hoping maybe you would have some experience with something like this.

    Please let me know if you run into anything.
    I truly enjoy reading your blog and I look forward to
    your new updates.

  89. This paragraph is genuinely a nice one it helps new web viewers, who are wishing in favor of blogging.

  90. I really like it whenever people get together and share thoughts.
    Great blog, continue the good work!

  91. You have made some really good points there. I checked
    on the net for more info about the issue and found most individuals will go along with your views on this site.

  92. botox says:

    botox botox near me botox before and after

  93. botox says:

    botox botox near me botox before and after

  94. botox says:

    botox botox near me botox before and after

  95. instagram private account igtv download site

  96. android instagram picture download

  97. wEm lUSQ bEQkRwvM iSmzoneo fKI, plgp HvOYCb EWJCVqzH krUqzoRl jtyMXRt. GDPBqW iIXjKmtv YHglwErR

  98. iphone quality instagram image download

  99. ios high quality instagram story download

  100. free instagram reels downloader for mac

  101. κατεβάστε βίντεο instagram online

Leave a Reply

Your email address will not be published. Required fields are marked *