HTML for Footer

[Colin]

On my website www.railwayphotography.co.uk I have added a ‘Footer’ Widget.

Take a look at the attachment below to see what it looks like.

Is there anyway I can add the ‘Follow Us’ + the logos on the same line as the menu links and copyright?

This is my HTML…...

<div align="”center”"><a href="https://www.railwayphotography.co.uk/">Home</a> | <a href="https://www.railwayphotography.co.uk/contact/">Contact</a> | <a href="https://www.railwayphotography.co.uk/links/">Links</a> | <a href="https://www.railwayphotography.co.uk/sitemap/">Sitemap</a> | <span style="color: black;">© Colin Wallace 2020 | <span style="color: black;"> Follow Us On <a href="https://www.facebook.com/ColinWallacePhotography" target="_blank" rel="noopener"><img class="alignnone wp-image-2672 size-full" src="https://www.railwayphotography.co.u...0/04/twitter-icon-32x32-52-e1587218676783.png" alt="Follow Us on Facebook" width="32" height="32" /></a> <a href="https://twitter.com/cw_photographs" target="_blank" rel="noopener"><img class="alignnone wp-image-2669 size-full" src="https://www.railwayphotography.co.uk/wp-content/uploads/2020/04/twitter-e1587217888800.jpg" alt="Follow Us on Twitter" width="32" height="34" /></a> <a href="https://www.pinterest.co.uk/colinwallacephotography" target="_blank" rel="noopener"><img class="alignnone wp-image-2668 size-full" src="https://www.railwayphotography.co.uk/wp-content/uploads/2020/04/pinterest-e1587217694465.png" alt="Follow Us on Pinterest" width="32" height="32" /></a></span></span></div>

Any help will be great thank you.

 

[Jennifer Neon]

On my website www.railwayphotography.co.uk I have added a ‘Footer’ Widget.

Take a look at the attachment below to see what it looks like.

Is there anyway I can add the ‘Follow Us’ + the logos on the same line as the menu links and copyright?

This is my HTML…...

<div align="”center”"><a href="https://www.railwayphotography.co.uk/">Home</a> | <a href="https://www.railwayphotography.co.uk/contact/">Contact</a> | <a href="https://www.railwayphotography.co.uk/links/">Links</a> | <a href="https://www.railwayphotography.co.uk/sitemap/">Sitemap</a> | <span style="color: black;">© Colin Wallace 2020 | <span style="color: black;"> Follow Us On <a href="https://www.facebook.com/ColinWallacePhotography" target="_blank" rel="noopener"><img class="alignnone wp-image-2672 size-full" src="https://www.railwayphotography.co.u...0/04/twitter-icon-32x32-52-e1587218676783.png" alt="Follow Us on Facebook" width="32" height="32" /></a> <a href="https://twitter.com/cw_photographs" target="_blank" rel="noopener"><img class="alignnone wp-image-2669 size-full" src="https://www.railwayphotography.co.uk/wp-content/uploads/2020/04/twitter-e1587217888800.jpg" alt="Follow Us on Twitter" width="32" height="34" /></a> <a href="https://www.pinterest.co.uk/colinwallacephotography" target="_blank" rel="noopener"><img class="alignnone wp-image-2668 size-full" src="https://www.railwayphotography.co.uk/wp-content/uploads/2020/04/pinterest-e1587217694465.png" alt="Follow Us on Pinterest" width="32" height="32" /></a></span></span></div>

Any help will be great thank you.

Hi @Colin, so I've a pretty tight hand at web designing and coding stuff. But yeah I discussed your issue with my designer and so here's the solutions given by her:

Change you HTML to:
<div align="”center”"><a href="https://www.railwayphotography.co.uk/">Home</a> |&nbsp; <a href="https://www.railwayphotography.co.uk/contact/">Contact</a>&nbsp; |&nbsp; <a href="https://www.railwayphotography.co.uk/links/">Links</a>&nbsp; |&nbsp; <a href="https://www.railwayphotography.co.uk/sitemap/">Sitemap</a> | <span style="color: black;">© Colin Wallace 2020&nbsp; <span class="social-cion-container" style="color: black;"> <span class="social-icon-text">Follow Us On </span>&nbsp; <a href="https://www.facebook.com/ColinWallacePhotography" target="_blank" rel="noopener noreferrer"><img class="alignnone wp-image-2672 size-full" src="https://cdn.shortpixel.ai/client/q_...0/04/twitter-icon-32x32-52-e1587218676783.png" alt="Follow Us on Facebook" width="32" height="32"></a> <a href="https://twitter.com/cw_photographs" target="_blank" rel="noopener noreferrer"><img class="alignnone wp-image-2669 size-full" src="https://cdn.shortpixel.ai/client/q_...nt/uploads/2020/04/twitter-e1587217888800.jpg" alt="Follow Us on Twitter" width="32" height="34"></a> <a href="https://www.pinterest.co.uk/colinwallacephotography" target="_blank" rel="noopener noreferrer"><img class="alignnone wp-image-2668 size-full" src="https://cdn.shortpixel.ai/client/q_.../uploads/2020/04/pinterest-e1587217694465.png" alt="Follow Us on Pinterest" width="32" height="32"></a></span></span></div>

And add the following CSS:
.social-cion-container {
display: flex;
align-items: center;
padding-top: 12px;
}
.social-icon-text {
margin-right: 20px;
}

 

[Colin]

Thanks for your help but it has not changed anything.

 

[Jennifer Neon]

Are you wanting something like this:

 

[theteamplayer]

thank you for sharing your question @Colin
this is one of the reasons i came away from wordpress. i was speading a lot of time making sites look pretty by handcoding in html.

for this, find the footer.php page and add the html code directly to it.

or do what i did and dump wordpress and learn google amp (accelerated mobile pages) code. if you know html, amp is turbohtml for seo, and google will activately promote your website, giving your preferred plaement in google search and pre-caching on their servers.

amp is dumbed down html, specifically being written (as we speak) by Google for her mobile web.

amp dot dev or web dot dev or search google developers amp project. good luck and thank you @Colin

 

[Colin]

Are you wanting something like this:
View attachment 356

@Jennifer, Yes, that is how I would like it.

 

[Jennifer Neon]

@Jennifer, Yes, that is how I would like it.

So just remove the CSS I had mentioned earlier and replace it with the following:

.footer-column-three {
max-width: 100% !important;
}
.social-cion-container {
margin-left: 10px;
}

 

[Colin]

@Jennifer, Thank you so much for helping me out with this code, it works and I am really pleased with it.

 

[Jennifer Neon]

Thank You, @Colin my pleasure.