How to add "Back to Top" to footer

[selhost]

Hi! I'm using the Education Pro theme and wonder if it's possible to add a "back to top" link in the footer without neeeding to add a plugin? I see the Genesis Simple Edits has the "backtotop" text, but it doesn't work in the footer (as seen in the site link below). I would appreciate any help you guys can give me. Thank you!

http://hlrsc.net

[Victor Font]

This is the code I use on my sites for back to top.

add_shortcode('footer_custombacktotop', 'set_footer_custombacktotop');
function set_footer_custombacktotop($atts) {
	return '<a title="Return to top of page" class="button gototop" href="#" aria-label="Return to top of page"><i class="far fa-arrow-alt-circle-up"><span class="screen-reader-text">Return to top of page</span></i></a>';
}

//* Add smooth scrolling for any link having the class of "top"
add_action('wp_footer', 'go_to_top');

function go_to_top() { ?>
	<script type="text/javascript">
		jQuery(function($) {
			$('a.button.gototop').click(function() {
				$('html, body').animate({scrollTop:0}, 'slow');
			return false;
			});
		});
	</script>
<?php }

This code can be added to functions.php. The shortcode is [footer_custombacktotop]. I also use a Fontawesome Up Arrow icon in place of text to indicate back to top. If you don't use Fontawesome, you'll need to change this code to something else that works for your site:

<i class="far fa-arrow-alt-circle-up"><span class="screen-reader-text">Return to top of page</span></i>

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Author]

Posts