Create Back To Top Navigation on Blogger Blog

Create Back To Top Navigation on Blogger Blog

Installing back to top navigation is a very important to implement, especially to make it easier for users to return to the first paragraph.
Imagine if you have a long post and have a lots of paragraphs, your users will have some difficulty to return to first paragraphs.

When you read a long article and theres no back to top navigation, Surely scrolling the screen to the top is quite frustrating, even though in this era all Gadgets have many applications that support back to top, but still you need to install it on your Blogger Blog.

If you are interested in how to Create Back To Top Navigation on Blogger Blog, read this article below:
How to install Back To Top on Blogger Blog.

1. Login to the Blog

2. Select >> Theme / Template

3. Select >> Edit HTML

4. Then look for the code below

]]></b:skin>

To make it easier to find, use CTRL + F to find it.
Copy the code below and paste it above the code ]]> </ b: skin>.

/* Back To Top Code */ #ignielToTop {display: none; z-index: 2; position: fixed; bottom: 20px; right: 20px; border-radius: 2px; cursor: pointer; transition: all .4s; width: 45px; height: 45px; background: # 008c5f url ("data: image / svg + xml,% 3Csvg viewBox = '0 0 24 24' xmlns = 'http: //www.w3.org/2000 / svg '% 3E% 3Cpath d =' M7.41,15.41L12,10.83L16.59,15.41L18,14L12.8L6,14L7.41,15.41Z 'fill ='% 23fff '/% 3E% 3C / svg% 3E ") no-repeat center center} #ignielToTop: hover {background: # 2f303f url (" data: image / svg + xml,% 3Csvg viewBox = '0 0 24 24' xmlns = 'http: //www.w3. org / 2000 / svg '% 3E% 3Cpath d =' M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z 'fill ='% 23fff '/% 3E% 3C / svg% 3E ") no-repeat center center}

Now look for the code below:

</body>

Use CTRL + F. Now copy the code below and paste it above </body> code.

<div id = 'ignielToTop' /> <script> // <! [CDATA [/ * Back To Top Code * / var igniel_kace = 300; // scroll speed var igniel_jarak = 300; // the position of the eval button (function (p, a, c, k, e, d) {e = function (c) {return (c <a? '': e (parseInt (c / a))) + ( (c = c% a)> 35? String.fromCharCode (c + 29): c.toString (36))}; if (! ''. replace (/ ^ /, String)) {while (c--) {d [e (c)] = k [c] || e (c)} k = [function (e) {return d [e]}]; e = function () {return '\\ w +'}; c = 1}; while (c -) {if (k [c]) {p = p.replace (new RegExp ('\\ b' + e (c) + '\\ b', 'g') , k [c])}} return p} ('f 7 = ["\\ h \\ a \\ g \\ h \\ F \\", "\\ C \\ h \\ w \\ c \\ a \\ a \\ l \\ c \\ v "," \\ e \\ c \\ h \\ K \\ p \\ 9 \\ d \\ b \\ m \\ a \\ 9 \ \ p \\ 9 \\ d \\ b "," \\ G \\ c \\ e \\ q "," \\ J \\ e \\ e \\ m \\ I \\ 9 \\ d \\ b \\ H \\ g \\ C \\ b \\ 9 \\ d \\ 9 \\ w "," \\ g \\ u \\ d \\ g \\ 9 \\ a \\ l \\ c \\ l \\ c \\ v ", "\\ u \\ 9 \\ b \\ m \\ a \\ 9 \\ p \\ 9 \\ d \\ b \\ M \\ q \\ U \\ e"]; 8 [7 [ 6]] (7 [5]) [7 [4]] (7 [0], jx () {fi = 8 [7 [2]] [7 [1]] || 8 [7 [3]] [ 7 [1]]; o (k <= 0) {s}; fr = 0-i; ft = r / k * X; L (j () {8 [7 [3]] [7 [1]] = 8 [7 [2]] [7 [1]] = i + t; o (i == 0) {s}; x (8 [7 [3]], 0, k)}, P)}, Q); BY (\ 'O \', j () {o (BN> = n || 8.Rz> = n || 8.Wz> = n) {8.y (\ 'A \'). ED = \ 'V \'} T {8.y (\ 'A \'). ED = \ 'S \'}}); ', 61.61,' ||||||| _0x3e17 | document | x65 | x6C | x74 | x6F | x6E | x64 | var | x69 | x63 | _0x2ceax2 | function | igniel_speed | x54 | x45 | igniel_jarak | if | x6D | x79 | _0x2ceax3 | return | _0x2ceax4 | x67 | xc | xc | getElementById | scrollTop | ignielToTop | window | x73 | display | style | x6B | x62 | x4C | x76 | x61 | x75 | setTimeout | x42 | pageYOffset | scroll | 10 | false | documentElement | none | else | x49 | block | body | 50 | addEventListener'.split ('|'), 0, {})); //]]> </script> 8 [7 [6]] (7 [5]) [7 [4]] (7 [0], jx () {fi = 8 [7 [2]] [7 [1]] || 8 [7 [ 3]] [7 [1]]; o (k <= 0) {s}; fr = 0-i; ft = r / k * X; L (j () {8 [7 [3]] [7 [1]] = 8 [7 [2]] [7 [1]] = i + t; o (i == 0) {s}; x (8 [7 [3]], 0, k)}, P)}, Q); BY (\ 'O \', j () {o (BN> = n || 8.Rz> = n || 8.Wz> = n) {8.y (\ 'A \ '). ED = \' V \ '} T {8.y (\' A \ '). ED = \' S \ '}});', 61.61, '||||||| _0x3e17 | document | x65 | x6C | x74 | x6F | x6E | x64 | var | x69 | x63 | _0x2ceax2 | function | igniel_speed | x54 | x45 | igniel_jarak | if | x6D | x79 | _0x2ceax3 | return | _0x2ax4 | x72 | ignielScroll | getElementById | scrollTop | ignielToTop | window | x73 | display | style | x6B | x62 | x4C | x76 | x61 | x75 | setTimeout | x42 | pageYOffset | scroll | 10 | false | documentElement | none | else | x49 | x4 | block | body | 50 | addEventListener'.split ('|'), 0, {})); //]]> </script> 8 [7 [6]] (7 [5]) [7 [4]] (7 [0], jx () {fi = 8 [7 [2]] [7 [1]] || 8 [7 [ 3]] [7 [1]]; o (k <= 0) {s}; fr = 0-i; ft = r / k * X; L (j () {8 [7 [3]] [7 [1]] = 8 [7 [2]] [7 [1]] = i + t; o (i == 0) {s}; x (8 [7 [3]], 0, k)}, P)}, Q); BY (\ 'O \', j () {o (BN> = n || 8.Rz> = n || 8.Wz> = n) {8.y (\ 'A \ '). ED = \' V \ '} T {8.y (\' A \ '). ED = \' S \ '}});', 61.61, '||||||| _0x3e17 | document | x65 | x6C | x74 | x6F | x6E | x64 | var | x69 | x63 | _0x2ceax2 | function | igniel_speed | x54 | x45 | igniel_jarak | if | x6D | x79 | _0x2ceax3 | return | _0x2ax4 | x72 | ignielScroll | getElementById | scrollTop | ignielToTop | window | x73 | display | style | x6B | x62 | x4C | x76 | x61 | x75 | setTimeout | x42 | pageYOffset | scroll | 10 | false | documentElement | none | else | x49 | x4 | block | body | 50 | addEventListener'.split ('|'), 0, {})); //]]> </script> L (j () {8 [7 [3]] [7 [1]] = 8 [7 [2]] [7 [1]] = i + t; o (i == 0) {s}; x (8 [7 [3]], 0, k)}, P)}, Q); BY (\ 'O \', j () {o (BN> = n || 8.Rz> = n || 8.Wz> = n) {8.y (\ 'A \'). ED = \ 'V \'} T {8.y (\ 'A \'). ED = \ 'S \'}}) ; ', 61,61,' ||||||| _0x3e17 | document | x65 | x6C | x74 | x6F | x6E | x64 | var | x69 | x63 | _0x2ceax2 | function | igniel_space | x54 | x45 | igniel_jarak | if | | x6D | x79 | _0x2ceax3 | return | _0x2ceax4 | x67 | x70 | x72 | ignielScroll | getElementById | scrollTop | ignielToTop | window | x73 | display | style | x6B | x62 | x72 | x76 | x61 | x75 | x75 | setTime | scroll | 10 | false | documentElement | none | else | x49 | block | body | 50 | addEventListener'.split ('|'), 0, {})); //]]> </script> L (j () {8 [7 [3]] [7 [1]] = 8 [7 [2]] [7 [1]] = i + t; o (i == 0) {s}; x (8 [7 [3]], 0, k)}, P)}, Q); BY (\ 'O \', j () {o (BN> = n || 8.Rz> = n || 8.Wz> = n) {8.y (\ 'A \'). ED = \ 'V \'} T {8.y (\ 'A \'). ED = \ 'S \'}}) . | x6D | x79 | _0x2ceax3 | return | _0x2ceax4 | x67 | x70 | x72 | ignielScroll | getElementById | scrollTop | ignielToTop | window | x73 | display | style | x6B | x62 | x72 | x76 | x61 | x75 | x75 | setTime | scroll | 10 | false | documentElement | none | else | x49 | block | body | 50 | addEventListener'.split ('|'), 0, {})); //]]> </script> 61, '||||||| _0x3e17 | document | x65 | x6C | x74 | x6F | x6E | x64 | var | x69 | x63 | x63 | _0x2ceax2 | function | igniel_space | x54 | x45 | igniel_jarak | if | x6D | x79 | x69 | x69 | x63 | _0x2ceax2 | function | igniel_space | x54 | x45 | igniel_jarak | if | x6D | x79 | _0x2ceax3 | return | _0x2ceax4 | x67 | x70 | x72 | ignielScroll | getElementById | scrollTop | ignielToTop | window | x73 | display | style | x6B | x62 | x4C | x76 | x61 | x75 | setTimeout | x42 | scroll | false | documentElement | none | else | x49 | block | body | 50 | addEventListener'.split ('|'), 0, {})); //]]> </script> 61, '||||||| _0x3e17 | document | x65 | x6C | x74 | x6F | x6E | x64 | var | x69 | x63 | x63 | _0x2ceax2 | function | igniel_space | x54 | x45 | igniel_jarak | if | x6D | x79 | x69 | x69 | x63 | _0x2ceax2 | function | igniel_space | x54 | x45 | igniel_jarak | if | x6D | x79 | _0x2ceax3 | return | _0x2ceax4 | x67 | x70 | x72 | ignielScroll | getElementById | scrollTop | ignielToTop | window | x73 | display | style | x6B | x62 | x4C | x76 | x61 | x75 | setTimeout | x42 | scroll | false | documentElement | none | else | x49 | block | body | 50 | addEventListener'.split ('|'), 0, {})); //]]> </script>

When everythings is done you can Save and preview the results
Now that's how to make the Scroll Back to Top Button for Blog / website.
If you find this article useful, consider to share it with your friends and families.