How to make writing run on websites and blogs

Have you ever seen a blog where there is a text that runs? Yes, we usually know it as running text or running writing. One of its functions is to convey information from a web to visitors. Besides that, running text can also beautify your blog.

For those of you who have a blog and want to enhance your appearance by using running text but you don’t know how to make it, take it easy below, we will share how to make running text very easily.

How to Make Writing Work

The first is the simplest, that is, it runs by default which we don’t have any effect.

<div class="px-2 bg-light "><marquee class="py-3">Selamat datang di blog kami yiptechid.com - Informasi, Tips dan Tutorial Seputar Teknologi</marquee></div>

Then it will look like this

Selamat datang di blog kami yiptechid.com – Informasi, Tips dan Tutorial Seputar Teknologi

Next is the addition of direction = “left”, ie the writing will move from right to left and add color to the text by giving style = “color: green;” You can enter direction = “right” and the result will move from left to right

<div class="px-2 bg-light "><marquee class="py-3" direction="right" style="color:green;">Selamat datang di blog kami yiptechid.com - Informasi, Tips dan Tutorial Seputar Teknologi</marquee></div>

Then it will look like this

Selamat datang di website kami teknologi.visitklaten.com – Sharing Teknologi – Berbagi Ilmu Tentang Teknologi

the third one with the addition of bgcolor = “yellow” will give a yellow color to the background. And onmouseover = “this.stop ()” onmouseout = “this.start ()” so that when the cursor is directed to running text, the text will stop and if not hovered it will move back.

<div class="px-2 bg-light "><marquee class="py-3" bgcolor="yellow" direction="left" onmouseover="this.stop()" onmouseout="this.start()">
Selamat datang di blog kami yiptechid.com - Informasi, Tips dan Tutorial Seputar Teknologi</marquee></div>

Then it will look like this

Selamat datang di blog kami yiptechid.com – Informasi, Tips dan Tutorial Seputar Teknologi

next is the addition of behavior = “alternate” attribute. So the effect is that the writing will go back and forth

<div class="px-2 bg-light "><marquee class="py-3" direction="left" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="10" behavior="alternate" style="color:red;">
yiptechid.com - Informasi, Tips dan Tutorial Seputar Teknologi</marquee></div>

Then the display looks like this

yiptechid.com – Informasi, Tips dan Tutorial Seputar Teknologi

Then the last thing is to give direction = “down” which will give the effect of running text running vertically or up and down

<div class="px-2 bg-light "><marquee class="py-3" style="color:blue;" direction="down" height="100" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4">yiptechid.com - Informasi, Tips dan Tutorial Seputar Teknologi</marquee></div>

Then the display will be like this

yiptechid.com – Informasi, Tips dan Tutorial Seputar Teknologi

Now after you create a script like that, then you have to attach it to the file structure on your blog, that is, we install this script in your index.php file. Mount it in the part according to your wishes, if you want to attach it above the header, then paste the script above the header script.

That’s how to make walking writing on websites and blogs that you can try to beautify your blog pages. Hopefully this is useful.

Leave a Reply

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