If your page content is lengthy, it’s good practice to add a ‘back to top button’ on your page. Many themes have the ability to add a ‘back to top button’, but if your theme does not have this ability or you want to use a customized button, this article is for you.
In this article, you will learn how to add a ‘back to top button’ to your WordPress site without a plugin.

Add back to top button in WordPress without plugins

Step 1.Add The Following Code to the functions.php File

Inside the WordPress dashboard Theme Editor or on the web server, find and open the functions.php file. Go to Appearance -> Theme Editor.

You must create a child theme before making any changes to functions.php file. Otherwise, the applied changes will be lost after each update.
Create child theme in WordPress step by step [without plugin]

As an alternative method, you can use the Code Snippets plugin to insert your codes into WordPress.

Copy the PHP code from the below box and paste it at the end of the functions.php file.

add_action( 'wp_footer', function () {  if ( !is_admin() ) {

$location = 'right'; // left or right
$scale = '1';	
$icon = '
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50.002" viewBox="0 0 13.229 13.23"><path d="M6.008 13.202a6.728 6.728 0 0 1-2.84-.947A6.93 6.93 0 0 1 .961 10.04C-.371 7.82-.315 5.104 1.109 2.963A6.602 6.602 0 0 1 9.572.7a6.834 6.834 0 0 1 2.685 2.466c1.292 2.108 1.297 4.735.012 6.873a6.93 6.93 0 0 1-2.206 2.216 6.674 6.674 0 0 1-4.055.947zM3.12 8.9c.067-.027.616-.559 1.796-1.738l1.7-1.697 1.699 1.697c1.18 1.18 1.729 1.71 1.795 1.738a.475.475 0 0 0 .556-.124c.157-.178.168-.388.032-.592-.04-.06-.909-.944-1.93-1.963-1.292-1.29-1.885-1.866-1.952-1.894a.549.549 0 0 0-.402 0c-.11.046-3.756 3.67-3.884 3.86-.094.142-.118.263-.079.394a.6.6 0 0 0 .274.323.57.57 0 0 0 .395-.004z"/></svg>
';
	
?>
<a href="#" class="back-to-top"> <div > <?= $icon ?> </div> </a>
<style>
.back-to-top svg {
    transform: scale(<?= $scale ?>);
}
.back-to-top {
    width: 50px;
    position: fixed;
    bottom: 0px;
    <?= $location ?>: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    text-decoration: none;
    opacity: 0;
    pointer-events: none;
    transition: all 0.4s;
    z-index: 20;
}
.back-to-top.active-to-top {
    bottom: 16px;
    pointer-events: auto;
    opacity: 1;
}
html {
scroll-behavior: smooth;
}
.back-to-top div:hover {
 animation: btt 1s linear infinite alternate;
}
@keyframes btt {
  0%   {transform: scale(1);}
  50%  {transform: scale(1.1);}
  100% {transform: scale(1);}
}
</style>
<script>
const toTop = document.querySelector('.back-to-top');
window.addEventListener("scroll", () => {if(window.pageYOffset > 100) {toTop.classList.add('active-to-top')} else {toTop.classList.remove('active-to-top')} } );
</script>
<?php }},100);

Step 2.Customize the scroll to top code

The above code will work by default, but you can customize it.

Here you can move the ‘back to top button’ to the right or left of the page.

$location = 'right'; // left or right

Here you can make the size of the button smaller or larger.

$scale = '1';	

Here you can change the icon of the button. I will put two more icons below for you to use.

$icon = '
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50.002" viewBox="0 0 13.229 13.23"><path d="M6.008 13.202a6.728 6.728 0 0 1-2.84-.947A6.93 6.93 0 0 1 .961 10.04C-.371 7.82-.315 5.104 1.109 2.963A6.602 6.602 0 0 1 9.572.7a6.834 6.834 0 0 1 2.685 2.466c1.292 2.108 1.297 4.735.012 6.873a6.93 6.93 0 0 1-2.206 2.216 6.674 6.674 0 0 1-4.055.947zM3.12 8.9c.067-.027.616-.559 1.796-1.738l1.7-1.697 1.699 1.697c1.18 1.18 1.729 1.71 1.795 1.738a.475.475 0 0 0 .556-.124c.157-.178.168-.388.032-.592-.04-.06-.909-.944-1.93-1.963-1.292-1.29-1.885-1.866-1.952-1.894a.549.549 0 0 0-.402 0c-.11.046-3.756 3.67-3.884 3.86-.094.142-.118.263-.079.394a.6.6 0 0 0 .274.323.57.57 0 0 0 .395-.004z"/></svg>
';

If you need more icons, a package of 200 hand-picked icons is placed below that you can buy and use.

back to top icon 2
Back to top icon 2
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 13.229 13.229" version="1.1" id="svg8"><defs id="defs2"><style id="style268"/><path id="b" d="M49.52 41c-.34-.19-.67-.38-1-.54-8.35-4.15-18.48-.75-22.63 7.6-4.15 8.35-.75 18.48 7.6 22.63 8.35 4.15 18.48.75 22.63-7.6 3.95-7.95 1.07-17.61-6.6-22.09z"/><path id="d" d="M94.16 41c-.34-.19-.68-.38-1-.54-8.32-4.14-18.41-.74-22.55 7.57-4.14 8.32-.74 18.41 7.57 22.55 8.32 4.14 18.41.74 22.55-7.57 3.94-7.92 1.07-17.54-6.57-22.01z"/><style id="style268-2"/><style id="style268-1"/><style id="style958"/><style id="style268-6"/><style id="style958-8"/><style id="style268-9"/><style id="style958-7"/><style id="style1087"></style><style id="style1185"></style><path id="a" d="M61.67 53.88c-8.51.05-17.01-.67-25.39-2.14a2.597 2.597 0 0 0-3 3C35.7 66.58 47.35 76.3 61.7 76.3c15.69 0 26.26-10 28.45-21.6a2.587 2.587 0 0 0-3-3c-8.41 1.49-16.94 2.22-25.48 2.18z"/><style id="style268-5"/><style id="style958-9"/><style id="style268-50"/><style id="style958-3"/><style id="style1920"></style><path id="f" d="M58.71 70.32c-6.6 0-7.69 7.56-6.11 11.88 1.58 4.32 6.27 7.33 10.45 6.91 14.99-1.51 18.75.94 20.71 5.4 2.69 6.16 5.92 6.47 9.2 6.07 4.8-.58 4.52-9.89 4.73-18.93.23-10.22-16.5-13.7-16.5-13.7s-19.32 2.37-22.48 2.37z"/><style id="style268-8"/><style id="style958-2"/><style id="style268-3"/><style id="style958-76"/><style id="style2339"></style><style id="style268-60"/><style id="style958-1"/><style id="style268-7"/><style id="style958-92"/><style id="style268-24"/><style id="style958-4"/><style id="style2710"></style><style id="style268-35"/><style id="style958-15"/><style id="style268-59"/><style id="style958-6"/><style id="style3221"></style><style id="style268-88"/><style id="style958-0"/><style id="style268-0"/><style id="style958-39"/><style id="style3563"></style><style id="style268-4"/><style id="style958-74"/><style id="style268-08"/><style id="style958-749"/><style id="style4317"></style><style id="style268-94"/><style id="style958-42"/><style id="style5031"></style></defs><g id="layer1" transform="translate(677.298 622.536)"><path d="M-670.684-618.028l3.388 3.388-.55.55-2.838-2.837-2.837 2.837-.55-.55zm6.615 2.107a6.622 6.622 0 0 1-6.615 6.614 6.622 6.622 0 0 1-6.614-6.614 6.622 6.622 0 0 1 6.614-6.615 6.622 6.622 0 0 1 6.615 6.615zm-.778 0a5.843 5.843 0 0 0-5.837-5.837 5.843 5.843 0 0 0-5.836 5.837 5.843 5.843 0 0 0 5.836 5.836 5.842 5.842 0 0 0 5.837-5.836z" id="path5343" stroke-width=".778"/></g><style id="style189"></style><style type="text/css" id="style83"/><style type="text/css" id="style118"/><style type="text/css" id="style147"/><style type="text/css" id="style249"/><style type="text/css" id="style988"/><style type="text/css" id="style1092"/><style type="text/css" id="style83-1"/><style type="text/css" id="style118-3"/><style type="text/css" id="style147-7"/><style type="text/css" id="style249-3"/><style type="text/css" id="style988-9"/><style type="text/css" id="style1092-3"/><style type="text/css" id="style83-4"/><style type="text/css" id="style118-2"/><style type="text/css" id="style147-0"/><style type="text/css" id="style249-4"/><style type="text/css" id="style988-6"/><style type="text/css" id="style1092-4"/><style id="style1442"></style><style id="style1460"></style><style id="style1484"/><style type="text/css" id="style83-6"></style><style type="text/css" id="style118-20"></style><style type="text/css" id="style147-03"></style><style type="text/css" id="style249-9"/><style type="text/css" id="style988-8"/><style type="text/css" id="style1092-7"></style><style type="text/css" id="style1405"></style><style id="style1588"></style><style id="style1619"></style><style id="style1647"></style><style id="style1672"></style><style type="text/css" id="style83-5"/><style type="text/css" id="style118-5"/><style type="text/css" id="style147-9"/><style type="text/css" id="style249-6"/><style type="text/css" id="style988-4"/><style type="text/css" id="style1092-9"/><style type="text/css" id="style1405-1"/><style type="text/css" id="style83-8"/><style type="text/css" id="style118-4"/><style type="text/css" id="style147-91"/><style type="text/css" id="style249-1"/><style type="text/css" id="style988-92"/><style type="text/css" id="style1092-5"/><style type="text/css" id="style1405-5"/><style type="text/css" id="style83-2"/><style type="text/css" id="style118-6"/><style type="text/css" id="style147-4"/><style type="text/css" id="style249-7"/><style type="text/css" id="style988-68"/><style type="text/css" id="style1092-90"/><style type="text/css" id="style1405-0"/><style type="text/css" id="style83-0"/><style type="text/css" id="style118-7"/><style type="text/css" id="style147-3"/><style type="text/css" id="style249-73"/><style type="text/css" id="style988-88"/><style type="text/css" id="style1092-6"/><style type="text/css" id="style1405-4"/><style type="text/css" id="style83-26"/><style type="text/css" id="style118-21"/><style type="text/css" id="style147-5"/><style type="text/css" id="style249-8"/><style type="text/css" id="style988-5"/><style type="text/css" id="style1092-0"/><style type="text/css" id="style1405-8"/><style type="text/css" id="style83-3"/><style type="text/css" id="style118-57"/><style type="text/css" id="style147-039"/><style type="text/css" id="style249-86"/><style type="text/css" id="style988-3"/><style type="text/css" id="style1092-2"/><style type="text/css" id="style1405-16"/><style type="text/css" id="style83-63"/><style type="text/css" id="style118-9"/><style type="text/css" id="style147-8"/><style type="text/css" id="style249-61"/><style type="text/css" id="style988-7"/><style type="text/css" id="style1092-62"/><style type="text/css" id="style1405-87"/><style type="text/css" id="style83-36"/><style type="text/css" id="style118-8"/><style type="text/css" id="style147-59"/><style type="text/css" id="style249-90"/><style type="text/css" id="style988-2"/><style type="text/css" id="style1092-71"/><style type="text/css" id="style1405-86"/><style type="text/css" id="style83-7"/><style type="text/css" id="style118-53"/><style type="text/css" id="style147-6"/><style type="text/css" id="style249-31"/><style type="text/css" id="style988-54"/><style type="text/css" id="style1092-73"/><style type="text/css" id="style1405-7"/><style type="text/css" id="style83-68"/><style type="text/css" id="style118-82"/><style type="text/css" id="style147-71"/><style type="text/css" id="style249-99"/><style type="text/css" id="style988-87"/><style type="text/css" id="style1092-96"/><style type="text/css" id="style1405-12"/><style id="style3616"></style><style type="text/css" id="style83-12"/><style type="text/css" id="style118-37"/><style type="text/css" id="style147-74"/><style type="text/css" id="style249-65"/><style type="text/css" id="style988-63"/><style type="text/css" id="style1092-1"/><style type="text/css" id="style1405-01"/><style type="text/css" id="style83-23"/><style type="text/css" id="style118-46"/><style type="text/css" id="style147-31"/><style type="text/css" id="style249-82"/><style type="text/css" id="style988-44"/><style type="text/css" id="style1092-58"/><style type="text/css" id="style1405-02"/><style id="style4023"/><style id="style4050"></style><style id="style4089"></style><style id="style4122"></style><style id="style4173"></style><style id="style4200"/><style id="style4410"></style><style type="text/css" id="style83-07"/><style type="text/css" id="style118-27"/><style type="text/css" id="style147-51"/><style type="text/css" id="style249-5"/><style type="text/css" id="style988-57"/><style type="text/css" id="style1092-72"/><style type="text/css" id="style1405-6"/><style id="style4700"></style><style type="text/css" id="style160"></style><style id="style5010"/><style type="text/css" id="style137"/><style type="text/css" id="style137-6"/><style type="text/css" id="style137-5"/></svg>
back to top icon 2
Back to top icon 3
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="80.615" viewBox="0 0 13.229 21.329" version="1.1" id="svg8"><defs id="defs2"><style id="style268"/><path id="b" d="M49.52 41c-.34-.19-.67-.38-1-.54-8.35-4.15-18.48-.75-22.63 7.6-4.15 8.35-.75 18.48 7.6 22.63 8.35 4.15 18.48.75 22.63-7.6 3.95-7.95 1.07-17.61-6.6-22.09z"/><path id="d" d="M94.16 41c-.34-.19-.68-.38-1-.54-8.32-4.14-18.41-.74-22.55 7.57-4.14 8.32-.74 18.41 7.57 22.55 8.32 4.14 18.41.74 22.55-7.57 3.94-7.92 1.07-17.54-6.57-22.01z"/><style id="style268-2"/><style id="style268-1"/><style id="style958"/><style id="style268-6"/><style id="style958-8"/><style id="style268-9"/><style id="style958-7"/><style id="style1087"></style><style id="style1185"></style><path id="a" d="M61.67 53.88c-8.51.05-17.01-.67-25.39-2.14a2.597 2.597 0 0 0-3 3C35.7 66.58 47.35 76.3 61.7 76.3c15.69 0 26.26-10 28.45-21.6a2.587 2.587 0 0 0-3-3c-8.41 1.49-16.94 2.22-25.48 2.18z"/><style id="style268-5"/><style id="style958-9"/><style id="style268-50"/><style id="style958-3"/><style id="style1920"></style><path id="f" d="M58.71 70.32c-6.6 0-7.69 7.56-6.11 11.88 1.58 4.32 6.27 7.33 10.45 6.91 14.99-1.51 18.75.94 20.71 5.4 2.69 6.16 5.92 6.47 9.2 6.07 4.8-.58 4.52-9.89 4.73-18.93.23-10.22-16.5-13.7-16.5-13.7s-19.32 2.37-22.48 2.37z"/><style id="style268-8"/><style id="style958-2"/><style id="style268-3"/><style id="style958-76"/></defs><g id="layer1" transform="translate(183.02 184.335)"><g id="g2007" transform="rotate(-45.001 -303.367 140.716) scale(.13475)"><path fill="#ca2c31" d="M3.77 71.73l16.34-16.1 27.82-4.93-2.75 14.56L7.57 76.82l-2.43-1.05z" id="path1924"/><path fill="#a02422" d="M22.94 59.76L5.2 75.88l13.05 6.36 19.81-10.11v-4.77l4.05-10.92z" id="path1926"/><path d="M64.92 88.15l-8.57 3.72-8.09 17.15s7.12 15.77 7.44 15.77c.32 0 4.37.32 4.37.32l14.4-16.1 3.64-27.5z" fill="#a02422" id="path1928"/><path d="M56.5 100.84s4.77-.97 8.17-2.59c3.4-1.62 7.6-4.04 7.6-4.04l-1.54 13.43-15.05 17.13s-.59-.73-3.09-6.17c-1.99-4.34-2.68-5.89-2.68-5.89z" fill="#ca2c31" id="path1930"/><path d="M31.58 80.66s-5.74-.48-12.03 7.47c-5.74 7.26-8.43 19.08-9.47 22.12-1.04 3.04-3.53 3.66-2.7 5.05.83 1.39 4.42 1.31 8.85.76s8.23-1.94 8.23-1.94-.19.48-.83 1.52c-.23.37-1.03.9-.97 1.45.14 1.31 11.36 1.34 20.32-7.88 9.68-9.95 4.98-18.11 4.98-18.11z" fill="#f7d74d" id="path1932"/><path d="M33.31 85.29s-6.19.33-11.31 8.28c-5.12 7.95-7.5 17.16-7.01 17.78.48.62 10.02-2.83 12.31-2.14 1.57.48.76 2.07 1.18 2.49.35.35 4.49.94 11.19-6.32 6.71-7.26 5.12-17.46 5.12-17.46z" fill="#fbf0b4" id="path1934"/><path d="M36.35 74.44s-3.11 2.77-4.22 4.36c-1.11 1.59-1.11 1.73-1.04 2.21.07.48 1.22 5.75 6.01 10.37 5.88 5.67 11.13 6.43 11.89 6.43.76 0 5.81-5.67 5.81-5.67z" fill="#858585" id="path1936"/><path d="M50.1 91.24s5.04 3.31 13.49.47c11.55-3.88 20.02-12.56 30.51-23.52 10.12-10.58 18.61-23.71 18.61-23.71l-5.95-19.93z" fill="#437687" id="path1938"/><path d="M67.99 80.33l1.39-4.32 3.48.49s2.65 1.25 4.6 2.16c1.95.91 4.46 1.6 4.46 1.6l-4.95 4.18s-2.7-1.02-4.67-1.88c-2.22-.97-4.31-2.23-4.31-2.23z" fill="#3f545f" id="path1940"/><path d="M84.32 16.14s-9.62 5.58-23.41 18.63c-12.43 11.76-21.64 22.4-23.87 31.45-1.86 7.58-.87 12.18 3.36 17.15 4.47 5.26 9.71 7.87 9.71 7.87s3.94.06 20.38-12.59C91 62.86 107.43 36.42 107.43 36.42z" fill="#8dafbf" id="path1942"/><path d="M104.18 41.84s-8.37-3.57-14.34-11.9c-5.93-8.27-5.46-13.86-5.46-13.86s4.96-3.89 16.11-8.34c7.5-2.99 17.71-4.52 21.07-2.03 3.36 2.49-2.3 14.98-2.3 14.98l-10.31 19.96z" fill="#d83f22" id="path1944"/><path d="M68.17 80.4s-7.23-3.69-11.83-8.94c-8.7-9.91-10.5-20.79-10.5-20.79l4.37-5.13S51.3 57.1 60.63 67.09c6.08 6.51 12.43 9.49 12.43 9.49s-1.27 1.07-2.63 2.11c-.87.67-2.26 1.71-2.26 1.71z" fill="#6896a5" id="path1946"/><path d="M112.71 44.48s4.34-5.23 8.45-17.02c5.74-16.44.74-21.42.74-21.42s-1.69 7.82-7.56 18.69c-4.71 8.71-10.41 17-10.41 17s3.14 1.41 4.84 1.9c2.14.62 3.94.85 3.94.85z" fill="#a02422" id="path1948"/><path d="M39.81 69.66c1.3 1.24 3.27-.06 4.56-3.1 1.3-3.04 1.28-4.74.28-5.46-1.24-.9-3.32 1.07-4.23 2.82-1 1.94-1.59 4.8-.61 5.74z" fill="#b3e1ee" id="path1950"/><path d="M84.95 20.13s-7.61 5.47-15.73 12.91c-7.45 6.83-12.39 12.17-13.07 13.41-.72 1.33-.73 3.21-.17 4.17.56.96 1.8 1.46 2.93.62 1.13-.85 9.18-9.75 16.45-16.11 6.65-5.82 11.78-9.51 11.78-9.51s2.08-3.68 1.74-4.52c-.34-.85-3.93-.97-3.93-.97z" fill="#b3e1ee" id="path1952"/><path d="M84.95 20.13s5.62-4.31 11.74-7.34c5.69-2.82 11.35-5.17 12.37-3.13.97 1.94-5.37 4.58-10.95 8.14-5.58 3.56-10.95 7.81-10.95 7.81s-.82-1.5-1.35-2.89a23.7 23.7 0 0 1-.86-2.59z" fill="#ed6a65" id="path1954"/><path d="M89.59 39.25c-5.57-5.13-13.32-3.75-17.14.81-3.92 4.7-3.63 11.88 1 16.2 4.21 3.92 12.04 4.81 16.76-.69 4.2-4.88 3.94-12.13-.62-16.32z" fill="#e1e1e1" id="path1956"/><path d="M75.33 41.87c-3.31 3.25-3.13 9.69.81 12.63 3.44 2.57 8.32 2.44 11.38-.69 3.06-3.13 3.06-8.82.19-11.76-3.3-3.37-8.59-3.9-12.38-.18z" fill="#3f545f" id="path1958"/><path d="M50 76.89s6.19-6.28 6.87-5.6c.68.68.59 4.49-2.37 8.73-2.97 4.24-9.5 11.79-14.67 16.88-5.1 5.01-12.29 10.74-12.97 10.64-.53-.08-2.68-1.15-3.54-2.19-.84-1.03 1.67-5.9 2.68-7.51 1.02-1.61 24-20.95 24-20.95z" fill="#a02524" id="path1960"/><path d="M21.23 101.85c-.08 1.44 2.12 3.54 2.12 3.54L56.87 71.3s-1.57-1.77-6.19 1.1c-4.66 2.9-8.74 6.38-14.76 12.21-8.39 8.14-14.61 15.8-14.69 17.24z" fill="#ca2c31" id="path1962"/><path d="M19.06 36.95c-1.11 1.11-1.16 2.89.08 3.91 1.1.91 2.89.32 3.56-.5.67-.82.59-2.6-.3-3.48-.89-.89-2.66-.6-3.34.07z" fill="#fff" id="path1964"/><path d="M41.02 35.65c-.84.93-.57 2.31.21 2.82.78.51 1.95.46 2.52-.24.51-.63.57-1.89-.21-2.67-.68-.67-1.98-.51-2.52.09z" opacity=".5" fill="#fff" id="path1966"/><path d="M55.55 11.89s1.22-3.48 1.94-3.52c.73-.04 1.78 3.48 1.78 3.48s3.61.04 3.85.57c.31.68-2.31 2.96-2.31 2.96s.85 3.4.45 3.81c-.45.45-3.56-1.34-3.56-1.34s-3.2 2.23-3.89 1.62c-.6-.53.65-4.13.65-4.13s-3-2.19-2.84-2.8c.23-.86 3.93-.65 3.93-.65z" fill="#fff" id="path1968"/><path d="M97.01 95.33c1.21.67 2.73.29 3.29-1 .51-1.15-.43-2.52-1.28-2.89-.85-.37-2.34.12-2.88 1.09-.53.96.14 2.4.87 2.8z" fill="#fff" id="path1970"/><path d="M114.19 65.84c-.69-1.07-2.18-1.42-3.15-.56-.94.84-.71 2.16-.18 2.83.53.67 1.95.92 2.81.37.86-.55.94-2 .52-2.64z" fill="#fff" id="path1972"/></g></g><style id="style189"></style><style type="text/css" id="style83"/><style type="text/css" id="style118"/><style type="text/css" id="style147"/><style type="text/css" id="style249"/><style type="text/css" id="style988"/><style type="text/css" id="style1092"/><style type="text/css" id="style83-1"/><style type="text/css" id="style118-3"/><style type="text/css" id="style147-7"/><style type="text/css" id="style249-3"/><style type="text/css" id="style988-9"/><style type="text/css" id="style1092-3"/><style type="text/css" id="style83-4"/><style type="text/css" id="style118-2"/><style type="text/css" id="style147-0"/><style type="text/css" id="style249-4"/><style type="text/css" id="style988-6"/><style type="text/css" id="style1092-4"/><style id="style1442"></style><style id="style1460"></style><style id="style1484"/><style type="text/css" id="style83-6"></style><style type="text/css" id="style118-20"></style><style type="text/css" id="style147-03"></style><style type="text/css" id="style249-9"/><style type="text/css" id="style988-8"/><style type="text/css" id="style1092-7"></style><style type="text/css" id="style1405"></style><style id="style1588"></style><style id="style1619"></style><style id="style1647"></style><style id="style1672"></style><style type="text/css" id="style83-5"/><style type="text/css" id="style118-5"/><style type="text/css" id="style147-9"/><style type="text/css" id="style249-6"/><style type="text/css" id="style988-4"/><style type="text/css" id="style1092-9"/><style type="text/css" id="style1405-1"/><style type="text/css" id="style83-8"/><style type="text/css" id="style118-4"/><style type="text/css" id="style147-91"/><style type="text/css" id="style249-1"/><style type="text/css" id="style988-92"/><style type="text/css" id="style1092-5"/><style type="text/css" id="style1405-5"/><style type="text/css" id="style83-2"/><style type="text/css" id="style118-6"/><style type="text/css" id="style147-4"/><style type="text/css" id="style249-7"/><style type="text/css" id="style988-68"/><style type="text/css" id="style1092-90"/><style type="text/css" id="style1405-0"/></svg>
scroll to top icons for wordpress

Scroll To Top icon pack

If this article is difficult for you to read in text, you can watch the video version below.

Share this post
Maya
Maya

Hi, my name is Maya and I’m a WordPress plugin developer. I created this website to share some of the helpful codes that I’ve used in my own projects.
If you’re looking for a custom plugin for your website, you can contact me by clicking on Hire a developer in the menu. I’d love to hear from you.

Articles: 56

2 Comments

  1. Many thanks. Where the for example the back-to-top icon 2 is used – is there a way to alter the colour? After a bit of experimentation I did a search and replace and replaced the 5 instances of: <path
    with
    <path fill="#990000"
    which has worked.

    Haven't yet worked out how to replace <path fill="#990000" with a variable – sat <path fill="back-to-top_icon_color" and define the color with the other variables of $location or $scale

Leave a Reply

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