Hi
I wondered how I would go about uploading an image-mapped logo to my website with three smaller icons/logos under the main text that click out to three separate links?
Can I upload it directly to the theme or do I have to add some html code somewhere?
Many thanks for your help.
Hi Iain
Unfortunately you’d need to write some custom code for this. There isn’t a way to do this from the admin alone. You’d need to create a child theme with a custom parts/header.php.
If you need someone to implement this for you, we recommend https://codeable.io/
Hi Greg, thanks for the reply.
I’ve already created a parts/header.php and I’ve got the html code for the image-mapped logo – do you know what code I need to replace?
Thanks in advance!
Just a follow-up to the last post – I’ve created a header.php file but do I need a parts/header.php?
I can see a footer.php and a parts/footer.php but only a header.php (there doesn’t seem to be a parts/header.php in the main theme files).
Thanks!
Hi Iain
Check out line 9 in /parts/masthead.php. That line handles the logo and it’s link back to the home page.
Hope that helps.
Hi
I ended up using someone on Codeable to implement the image map logo and it now works great.
One question however – I see there is an update for the Vantage theme, would I be correct in thinking that I would lose the above function again if I update?
I believe the coder added the custom CSS to the main footer and stylesheet and not to a child theme. How would I update the theme without losing the custom code?
Thanks
Glad to hear you made progress there. There are times when I also throw in the towel and hire someone to help out with a particular feature or towel. It can be a nice way to augment your projects and push them a little further than they might have gone on your own.
I would have have hoped/expected that the developer in this case would have made these changes upgrade safe. Please don’t update until you’re sure.
Please can you confirm the files that were modified. We need to use a child theme and copy those over to the child theme. Anything under Appearance > Custom CSS, as you know, is fine, but changes to style.css or any theme files aren’t.
Here is a vanilla child theme to start with if needs be:
https://siteorigin.com/wp-content/uploads/2015/01/vantage-child-vanilla-enqueue.zip
Keep in mind that when you activate a child theme all Customizer and menu settings reset. This is to be expected.
Hi Andrew – sorry for the delayed response.
He added custom CSS to the header.php and footer.php
I already have a child theme so do I just copy those two files from the main theme and import them to my child theme?
Thanks
Hopefully just a typo there. Custom CSS should go either into the style.css file in your child theme OR into our theme Appearance > Custom CSS page.
Then yes, any edited files must be copied, not cut, copied into the child theme.
So it’s like this:
1. Any CSS that was part of this custom job must go into child theme style.css or Appearance > Custom CSS.
2. Any functions that may have been added to the theme’s functions.php can go in a functions.php file in the child theme.
3. Any edited files must be copied across to the child theme. Doesn’t work for all files, for example it won’t work for /inc/template-tags.php.
The above rules are general child theming stuff.
My mistake – he added the custom css to the footer.php and a couple of CSS rules to the stylesheet – not the header.php.
I’ve tried to contact him but have had no response.
Thanks
No problem on the delay, glad to hear you’re looking into this. And of course make a backup of the files sent from Codeable in case you need to grab them again for any reason.
Iain can you mail me quickly on [email protected]. Can I see the files from the job please.
Sure thing – how do I let you see the files?
Ok, so the developer just edited your files on your server then? He never sent you any copies of the work?
No – I gave him temporary login details and then deleted them.
Ahh, ok, mmm, not super impressed by this but at least we’re fixing. Perhaps I don’t need to see the theme. When you say he added CSS to the footer, do you mean there is inline CSS there? Because that’s fine. Inline CSS is something like:
So in summary, I think just do this. Copy your entire footer.php file to the child theme, do the same for the header.php file. Then, if you know which selectors he edited in style.css, those need to go into either:
style.css of the child theme
or
Appearance > Custom CSS.
Once that is all done. Please make a copy of you entire theme folder at /wp-content/themes/vantage. Backup that vantage folder there.
I’d already copied the footer and header php files into the child theme but I’m not sure what he added to the stylesheet and where
It was to make the header logo image mapped to three different links – would it be this starting line?
#masthead .hgroup.full-container #Logo-Map.placed{
background:rgba(255,255,255,0);
So assuming you haven’t made any changes there, please let me know which version of Vantage you’re using. I’ll send you the original. You can then run a comparison using DiffMerge:
https://sourcegear.com/diffmerge/
I’m using 2.3 at the moment
One moment, let me just run this diff quickly.
Here we go, the following needs to go in Appearance > Custom CSS or style.css of the child theme:
#masthead .hgroup.full-container { position: relative; } #masthead .hgroup.full-container #Logo-Map { position: absolute; bottom: 60px; right: 0; width: 350px; height: 50px; z-index: 999; } #masthead .hgroup.full-container #Logo-Map.placed{ background:rgba(255,255,255,0); } #masthead .hgroup.full-container #Logo-Map a { display: inline-block; height: 50px; } #masthead .hgroup.full-container #Logo-Map .first_link { width: 230px; } #masthead .hgroup.full-container #Logo-Map .second_link { width: 65px; } #masthead .hgroup.full-container #Logo-Map .third_link { width: 52px; }So if I add that to the style.css of the child theme, I can then update the theme?
Assuming header.php and footer.php were the only other files changed then yes. I’m running a pretty cool diff app that lets me view diffs on a folder level. If you want to be completely sure you could do access your server via FTP, download your vantage folder from /wp-content/themes and send me a ZIP copy via email. I’ll then check the entire folder.
(Please backup the “vantage” theme folder before upgrading).
Ok brilliant – it might be a daft question but where should i backup the vantage theme to? Do I do it on cPanel? Thanks
If you’re not setup with FTP then cPanel will be easiest. cPanel has a File Manager option. Navigate to wp-content/themes/ and download the “vantage” folder. Keep it safe. Make a copy, ZIP it and email it to us please.
Be careful when working in the File Manager. Well…just work slowly.
That’s what I thought but when I highlight the vantage folder, the download tab is blacked out and I don’t have the option to download. Just copy, compress, move etc.
Ok, sounds like compression is the way to do that, please see the answer here:
http://www.netbuilders.org/web-hosting/how-can-i-download-folder-file-manager-17039.html
That did the trick – should I send the file to [email protected] ?
That’s it. Thanks.
Yep that’s done.
Cool, that’s it, just header.php, footer.php and style.css. All covered. Done. Just keep a copy of the vantage.zip file you sent me.
So I can upgrade the theme now?
Go for it.
Brilliant – thanks for all your help you’ve been amazing.
For sure, no problem. Let us know how the upgrade goes.
Just completed it and it all seems fine. Thanks again, very much appreciated.
Awesome, that’s great news!
Cheers