How To Edit The WordPress Header | WP Learning Lab
[MUSIC PLAYING] Hey it’s Bjorn from
WP Learning Lab. In this tutorial,
I’m going to show you where to find the
WordPress header.php file where you can make the
edits you need to make. I’m not going to
show you any edits to do in there because I have
no idea what you’re doing, and really, because
you’re in the php file, the ability to do stuff
is pretty much limitless. So there’s really not
much I can show you because I have no idea what
you want to accomplish. If you tell me what you need,
you can comment in the comments below, and I’ll see
if I can help you out. But barring that, here’s
how you find the header.php file so you can make some edits. First, we log into
the dashboard. Then we go to appearance,
and we click on editor. And I’m going to press
Command F, or Control F, and type in header.php. And we have the header
file show up here. Click on that to load
that file into the editor. And this is now all the php in
the header file for the Avada theme. And I can go in here. I can edit whatever I want. This looks very
intimidating if you’re not familiar with WordPress
hooks, theme hooks, and php. So if you’re not
familiar with those, I don’t recommend you
mess around in here because one wrong move and
the whole site goes down. So it really isn’t
the place to mess around if you don’t
know what you’re doing. One drawback of using
the editor like this is if you make a
change and you save it, you can’t undo what you did. So you either have to
remember what you did and then change it back
if you break something, or you have to go and download
an original theme Avada theme copy of the header
file and look in there to see what the original
should look like. A way to get around this
is using an FTP client. So I have the site pulled
up in FTP right here. If we go to the content folder,
themes folder, Avada theme, and then find the header
file, and right click on it, and choose open width. And then I’m using Sublime
Text 2 as my default editor. And here, I can make a change. For example, if we
go to the live site, we see it loads just fine. Now if I go, and I’m just
going to delete all of this. Save this file. And this is going
to crash the site. Refresh this page. And holy moly, that’s not what
the site should look like. And this can happen
at any second when you’re editing in the
header file or any php file in the wordpress
theme for that matter. So now is when the
adrenaline kicks in. You’re a little bit panicked. If you’re in the editor, in
the theme editor over here, you have to know exactly
what you took out. Otherwise, you can’t get
it back very quickly. You can always download
the original file like I said and
find the original but that might take too long. So instead, if you’re
using FTP in a text editor, I can just go into edit
menu, click on Undo, left, delete, it puts all the
stuff back, save the file. Files uploaded again. Refresh this page,
cross my fingers, and everything’s back
to how it should be. So that’s the benefit
of using an FTP client. Even if you edit this file
in the cpanel File Manager, there is no undo command in
most of those file managers. So if you make that
change, you better know what you changed in
case something breaks. I recommend you use an
FTP client to do it. And I also recommend
that you don’t mess around too much
in here unless you know what you’re
doing or you know the exact thing you want to do. For example, you might
just be copying and pasting a Google Search Console
verification code meta tag in here. In which case, you just go in
here and paste the meta tag. Let’s pretend this is. I just copied one from below. Save the file, and
then it’s all good. You’re not going
to break anything by just adding meta tag as
long as you don’t interfere with any php commands. So simple changes
like that, anybody can do more advanced changes. Do it only if you
know what you’re doing and make sure you have a way to
revert back to the working copy if the site breaks. And that’s where we edit
the header.php file. I hope this video helps you. My name is Bjorn
Allpas WP Learning Lab. Please make sure you like this
video, share on social media, subscribe to our
YouTube channel, and check out
wplearninglabe.com where I publish more tech tutorials
like this every single day. Talk to you soon.
Hi, when I try to do this on wordpress.com I get a completely different UI. Do you know why?
Hi dear I hope you are well. Sir im using asrid them free version any idea how to customize it??
Hi there! Can you explain how to add a line of text within the header? I'm needing to add a phone number next to my clients logo (their request) and I'm not sure how to do that. I'm proficient in html and css so I can style it. The template I'm using doesn't have that feature built in. I'm familiar with php on a student level. I can read it but I can't yet write it. Here is my url for the site I'm working on. cannapack.completedigitalagency.com. Thank you! Cheryl
hello, i want to know something please, i use my website theme in wordpress one year. know i want to change restyle this theme with coding my own so what should i do?
hi, very new to this. I am trying to verify my website through google search console. I need to paste a code to my homepage, but I don't know where to access the part of my website's homepage where I can paste it.
wordpress sux
people who deal with wordpress become totally deranged
OR… you can copy and paste the original code into notepad or any other word processor and save it as a backup.
how do you adjust the padding in the header? Thanks for the video!
How do you change the text in the browser tab? What's this text/tab called? Please help.
SIR I CANT NOT FIND MY THEME EDITOR IN APPEARANCE SECTION..WHAT TO DO…AM ALREADY GONE FTP FILE MANAGER THERE I DONE ALL PERMISSION BUT STILL NOT SHOWING MY EDITOR OPTION IN THEME APPEARANCE SECTION?
Thanks you
Hi how to add logo and text in header
i watched two minutes… got scared… Im leaving lol
You should begin by mentioning that this is not an option for personal plans. Under Appearance, the Editor button only comes up with business plans.
How do you remove header title and image on certain pages?
Night-Club Panama-City
1 second ago
Is there a plugin to hide home page from navigation? Not from the page i got with css but cant hide it or remove from nav bar? i was wondering is there just a plugin for this. i found one but its out date
Thank you !
i dont have the editor button my my site :s do you know how to fix this issue ?
Hi. Can you please tell me how to hide the header from the Blog Page and individual Blog Posts?
Hello, i need help. In my multisite sub theme i new default header, same heder like in default theme, here how is looks like: http://nemanjafalb.naissus.info , need this header in this theme: http://nemanjafalb.naissus.info/oglasi/
I'm on my dashboard on WordPress trying hard to find the Header PHP. I've been following everything but still, it doesn't appear on my menu on the right side like on yours.
I want to insert the Google site verification. It is possible because WordPress has been updated again?
I need to add a new logo onto my work webpage. There is no logo tab under appearance. When I hover the logo it says "shift and click to edit widget". I did that and nothing happened. I feel like I searched everything, please help!
I HAVE ACCIDENTALLY DELETED A CODE IN THE HEADER.PHP, HOW CAN I RESTORE
Am using maxblog
Version: 7.2
any solution
in header.php, How can i find or change title ? of site
Hi Bjorn, thanks for always being so kind enough to respond to comments – really appreciate that as i'm sure you're super busy! I'm really struggling with being able to change my WP Header Style at the moment. For example, my theme imported >>> 'About / Blog / Information / etc' for the Header Menu Seperators, but i don't want the slash and would prefer either nothing in between the Page Labels or >>> 'About | Blog | Information | etc. – how do i change the separators to a vertical bar? Please help, i've not slept! Thank you, as always!
Update: I have finally found the code for editing this upper bar in the header.php file of my site. However, I still run into a couple of problems while trying to edit. I have created new logo images (attention to details such as size, background, etc. were taken into consideration) but when I change the location target for the logo file, it throws my nav bar out of alignment, makes the new logo very small and messes up the spacing of the upper bar. I have tried many things to resolve this situation and nothing works.
We've been running our website for years. A company came in and offered to "help" us update our image and we agreed. They converted everything over to WordPress (which I have been learning how to use) but they have added a Black bar of info above our header bar that I haven't ever been able to edit since they made these changes. I have spent so much time trying to research how to change this one bar so we can update our logo and some text fonts. Is there any advice you may be able to give me so I can figure out how to update this? Thanks in advance!
Hi. I'm updating a website someone else had set up. The phone numbers etc on the top right corner are overlapping the menu bars and it looks awful. www.setantamachinery.com I currently have no idea how to change this. I looked everywhere but can not edit that. Any tips or advice is appreciated. Thanks!
My website guy is refusing to assist me when i told him that my banners aren't sliding and google adwords keeps saying I have malware. He insists that it's not his problem. I decided to watch videos on how to remove malware from my site and added sucuri. These are the two issues that came up and I can't find the right tutorial to help me.
I'm going bonkers! Any advice or help is kindly appreciated!
In order to improve the security of your site against ClickJacking, it is recommended that you add the following header to your site:
X-Frame-Options: SAMEORIGIN
AND
Security Headers – X-XSS-Protection
In order to improve the security of your site against some types of XSS (cross-site scripting) attacks, it is recommended that you add the following header to your site:
X-XSS-Protection: 1; mode=block
How can I edit the head on a single post? I was trying to find the archive on cpanel but I can't find it
I had to do the ftp way… I had no editor link to click in my wordpress control panel. Still easy enough to do. Thanks for video
how to remove space between menu bar and logo ? please help
I've been playing with the Mesmerize theme which offers a video option for the theme header background. I linked to a youtube video, which autoplays and looks great, but I can't get the video to start at a specified time. The URL I used included the "=1m4s" direction at the end but the video still autoplays from the beginning. I've browsed through the header files in the editor and can't locate where the link lives or where I might code in a start time. Any ideas?
Mines want show a Editor Option how do i Get to the Header phppage
Hi there, how do you add a full height/fullwidth hero image to the header on the homepage only, that also scrolls down to just a sticky header. Here's what I'm trying to accomplish: https://helloyoudesigns.com/ Thanks!
Hi, I know, it's kind one year later. But….
I change the name of the theme in the folder for theme and change style.css
But header gets snappy and does not work
How do you change the header so it follows the changed theme name?
Note: When i change back to the theme name I bought, it will be fine ….
Hi, I am using Travel agency theme to built a website. I would like to link the banner image on the homepage to another page. Could you please help me with this?
Hi , I made mistakes when modifying themeplate demo please can you tell me how i put it as its was before for I start the modifying again. thanx
Hello, I created a function to display number notifications with a bell icon. Iv managed to get it into the menu bar but how would I put it into the masthead/header. Did you know any filters or actions which would display the function into the header?
HELP! I CAN'T REMOVE THE THEME HEADER, IM USING OPTIMIZEPRESS, BUT WHEN I CREATE A NEW PAGE, THE Sage Starter HEADER appears…
the website was already made by someone else, I am redesigning, but always appears the menu and the logo that they put before
Thank you for this tutorial. Really informative. please i have a question, how do i add a facebook pixel base code to the header section of every page on my wordpress website ? thanx in advance
How to use wordpress header in my own PHP file
How do I change the location of my "site identity logo" and title that I created using page builder?
Thanks,
Hello can you please help me on how to edit my phone number on the top of my menu website, I tried to go to appearance – widget but didn't find it
here is my website; www.etvoilaparis.com
Love your videos! How can I add an image in the main header?
Great video, as always! I do have an issue and I really don't know how to fix it explain, but in my articles on the title it comes up tiny, is there any places where I can send you a print screen so u can check it for me? please! I really dont know what to do.
Hi i uploaded an image. It fits well on the desktop mode. unfortunately, it is badly cropped and damaged on the phone mode. Can you help me solving this plz? thx
How can You Change the Length of the border?!
hi love ur video but i need to know how to put already made html pages in wordpress as theme
in a way that i can move from one page to the other
I need to change the subtitle of my website.
if i make changes to my header.php file, should i put it in my child theme folder? what purpose does this serve? also, i noticed that the functions.php in the child theme folder is smaller than the function.php in the main folder. basically, what im trying to ask is whether code in child theme functions.php or any file in the child theme folder, is it an extension of the main files? and so putting them there maintains the original files in case an update is needed.
Hey. I have a logo. I would like to know how to add my name after my site name in google search?
Hi.. I have a peculiar issue on my WP site regarding my logo. I have the my logo all set up and customized and its perfectly appearing on my website. However, on the tab & mobile mode- i am seeing a different/ default woo commerce logo. If have seen the tab and phone tab editor section in customization panel. my logo is appearing same there too. But when viewed on tab or phone- my logo is not reflecting. I am lost- and not sure what i should do. Reference: I am using WP Ocean theme.
To have this red bar on the top of something that you are teaching is not good. You should let your email marketing tools come at least a little after we can see what you are doing since this is a tutorial video.
Above my blog image there is a small part from header image? How can I fix this? Please, I need help with this issue.
Or it's also good to comment original and add new code, if the new one crashes the website, simple delete what you added and uncomment the previous one) Hope you understand what I mean)
But do you have video tutorial where you explain this topic using example on how you make changes using php?
Hi We just want to change the homepage header image. WordPress support advise….Appearance | customise but we don't see the option for header or background image. We are not familiar with php can you advise how we change the image easily?
Can you explain how to connect your ftp client to your WordPress site?
Hello, I'm looking to remove the top header of my simple website www.quantovaleaminhacasa.eu , can you help me on that? Thanks
Where can I edit the wordpress menu? and how can I change different menu effects in my wordpress template?
I only want to change the colour of the header and add a logo on it. Is this something that is easy for me to do even though I do not have a lot of programming experience?
i want to remove header in one specific page. can we do this. plz help me
Sorry to ask this here, but in your deep library have you ever done a tut for how to create a second or third header.php to use on specific pages or a new page template? Like, my "page-books.php" template uses "header-books.php" for that page. and hpw to insert that in to the get header function (hook?) once again, apologies for asking here but I couldn't find a generic email for you here.
BEST!
Hey, maybe you can make video on how to insert and customise call to action button in header, and how to make it responsive?
Keep on good work.
Greetings!
Can you explain for other's who are not familiar with Editor, please and thanks
Great tutorial can you please tell me whats the recommended sized pixels of the WP header i added an image sized at 1600x500px but it stills crop the image and show it with a low quality, i just need the image to fit and to be seen in high quality, what will you recommend?
Hi. Do you know how to convert a theme image to responsive design? I'm using a Canva graphic I created and it looks nice on the desktop, but the image doesn't crop to size for mobile devices. Thank you. The site is turfandcleats.com
All I have in editor is funtions.php and style.css thats it
The Site Title contains HOME – (then the actual site name) – How do I remove HOME from the Title? Is there a specific php file that I must edit?
I need to change the header color in my Heiro theme wordpress site. I have taken the size of the header and tried to upload a custom header but it does not fill the whole header and I have this wide black boarder I cannot get rid of. It doesnt look good! I am also not familiar with php and am worried I will mess up my whole site trying to use it? Any help would be gratefully received.
I'm trying to resize the header on my Anissa themed WordPress site (uprootedflorist.com), and I'm super new to this. It looks okay on mobile but not desktop. I'm worried I'll edit something and not be able to fix it. Is there something I can add under "additional CSS?" I've Googled until my brain hurts. I'm not a developer or designer, just trying to build a site for a friend.
This is a big help … and i'll try to get there with FTP (GoDADDY) vs. Editor in the WP Theme. But, this is what I need to do: I'm trying to add a code from Mailchimp for in order to be connected. According to them, we ARE already connected in one message. But, when I go to finish the Mailchimp campaign I get a message that says we aren't connected. And, I'm here because I spent 2 hrs with Mailchimp today … This is what they have for how to add their code to our site:
Copy code
Click Copy and access your site’s HTML.
Add code
Decide which pages you want to connect to Mailchimp. ( I have no idea what pages I would want to connect. I assume the Home page? (It's for a book we are selling and there is an "About this Book" page as well …) For each of these pages, paste in your site code just before the closing </head> tag.
So, I find the </head> tag and just before the closing one … I paste whatever their code is, I am assuming.
Check connection
After you're done, return to this page and check connection.
If you can help, great! Thanks again… I'll watch the vid again too.
However….
The developer created a child theme and I have to go to public_html and only see Function.php, a style.css. The header.php is in the MAIN theme however … but not the child theme. And I ain't gonna do nuttin' at this point. 🙂
Good stuff. so the new twenty nineteen doesn't support a fixed heazder?
When I try to search for header.php, it says no results found, sooo what's that all about? I love the website I have right now, I just want my header to be a different font.
So your video is entitled "How To Edit The WordPress Header", then you go forward and say "If you're not familiar [with .php], I don't recommend that you mess around in here." So what exactly are you instructing…?
the header section on wordpress really does suck. it states use 1950×500 but when i do, it cuts the image in half horizontally and sticks the main site links on top of it. i really dont understand how they could mess up such an important part of a site. i use the customized edit for the woocommerce storefront theme.
Just watched this to help with problem. Helped me locate the correct folder/file. A simple change of the masthead from site.header to none and solved. Many thanks buddy.
I"m using the WordPress Clean Magazine template and often use the "sticky" feature for important news stories. But the bar shows the word "featured" and I'd like to know how to change that to something like Breaking News or Alert. Any thoughts? I'm a little afraid to dial around in PHP too much.
I want to create button in my header only for mobile users….I have html,js,CSS code but how to implement this code help
Thank you for teaching how to add / edit the php and not another video of installing a plugin to do it for you.
I am trying to delete the google analytics script from my header.php. I forgot how I placed it in there. Do you know what code I should be looking for?
IF you have time, you can make the navigation text larger in TwentySeventeen theme.
how i change the size of title and tagline using social care demo version theme
Hi,
I want to change the color of my header from black tot white. I am using the Astra theme. Do you know how i can change this?
The url is www.zakelijkvergelijken.com
Thanks in advance!
Best,
Frank
why ur video is showing something else?
how to find the noindex header so my sit can be indexed
Would be good to see some examples of what you can do with it – also if any, blog sites that shows you demos of various codes that you could add to the header.php file 🙂 example: Want your header looking like this? – USE THIS CODE – Put it here…. etc etc
If the theme updates, what happened to the changes in the header.php??
Ok they updated wordpress once again, So i can't find it, Bravo.
Very simple look in apperiance and theres no editor.
I want to change the html link in the header bar on a specific page (without changing the rest of the header bars on the website which are defaulting the link to the homepage). I don't have full access to the site and can not access the theme options tab. is there an add on?
Great Video! Do you have one showing how to move the font up or down in the header?
https://knowmusic.org
This is my blog. I wish to change the header at the footer of the website. How to do that?
Pretty crummy 'tutorial'. Here it is but don't mess with it. How about showing how to create a child-theme to edit rather than the original? How about showing a visual editor instead of raw code?
Hi, I'm trying to customize the header within the header.php file but the theme (Customify) has a complex structure and I can't find out where the logo and menu rules are located. Have you experiences with this particular theme?
There's a simpler way to protect the original file data: In the window, left click, then select crtl-a, then crtl-c, then open NOTEPAD, and use crtl-v to paste data. Save file with memorable name. Original data is now protected no matter what gets broken. Simply reload editor and PHP file, delete all file data in box, and replace with SAVED original data into the now empty box and save. All fixed.
why i dont have a editor button can any tell me
how can i change header menu background colour?
Confused speaker