Follow us on Youtube.  | Follow Website !

Search Suggest

How to Make a Script Box in Blog Posts 100% Working


The Script Box is a box in which there is a source code section, this script box is somewhat similar to the highlighter syntaxt it's just a different look.
The function of the script box so that the appearance of the source code so it looks neat and does not take place, not only that the appearance of this script box is also a lot of choices and various colors that you can use to enhance your blog's appearance.

How to make a script box in a Blogspost

Step 1:  Log into the Blogger account.
Step 2:  Make a new post on your blog.
Step 3:  Change  compose  to  HTML .

Step 4:  Please  copy the  code below, then  paste the  code into  HTML .

  <div style = "background-color:  # ffa66f ;  border:  2px  # 6e2222  dashed; text-align: left; height:  30px ; overflow: auto; padding:  10px; width: auto;"> Please save your   posts that will use scroll box here </div>

<div style = "background-color:  # ffc7c7; border:  2px # 6E2222  dotted; padding:  10px; text-align: left; height: 30px ; overflow: auto; width: auto;">Please  save your posts that will use scroll box here </div>

<div style = "background-color:  # 82cafa ; border:  3px # 6E2222  double; padding:  10px; text-align: left; height: 30px ; overflow: auto; width: auto;">Please save your posts that will  use scroll box here </div>

<div style = "background-color:  # 6eb76a ; border:  2px # 6E2222  inset; padding: 10px; text-align: left; height: 30px ;  overflow: auto; width: auto;">Please save your posts that will use scroll box here </div>

<div style = "background-color:  # c2c2c2 ; border: 2px # 6E2222 ridge; padding: 10px; text-align: left; height: 30px ; overflow:  auto; width: auto;">Please save your posts that will use scroll box here i </div>

<div style = "background-color:  # d9da81 ; border:  2px # 6E2222  solid; padding: 10px; text-align: left; height: 30px ;  overflow: auto; width: auto;">Please save your posts that will use scroll box here </div>

<div style = "- moz-border-radius: 10px; -webkit-border-radius: 10px; background-color:  # f3f3f3 ; border-left: 5px solid  # 2288dd; border-radius: 10px; padding: 10px; text -align: left; height:  30px ; overflow: auto; width: auto; "> Please  save your posts which will use the scroll box here </div>

<div style = "- moz-border-radius: 10px; -webkit-border-radius: 10px; background-color:  # f3f3f3 ; border-radius: 10px;  border: 4px solid # 999; padding: 10px; t-align : left; height: 30px ; overflow: auto; width: auto; ">Please save your posts  which will use the scroll box here </div>

<div style = "- moz-border-radius: 10px; -webkit-border-radius: 10px; background-color:  # ffe599 ; border-radius: 10px;  border: 2px dashed #aaa; padding: 10px; t-align : left; height:  30px; overflow: auto; width: auto; "> Please save your posts  which will use the scroll box here </div>

<div style = "- moz-border-radius: 10px; -webkit-border-radius: 10px; background-color:  # 6fa8dc ; border-radius: 10px;  border: 4px double #fff; padding: 10px; t-align : left; height: 30px ; overflow: auto; width: auto; ">Please save your posts  which will use the scroll box here </div>

<div style = "- moz-border-radius: 10px; -webkit-border-radius: 10px; background-color:  # a2c4c9 ; border-radius: 10px;  border: 4px outset #fff; padding: 10px; t-align : left; height: 30px ; overflow: auto; width: auto; ">Please save your posts  which will use the scroll box here </div>


IMPORTANT:  Please select the Script box you want to use, don't forget to replace the red color   with your writing.

Step 5: Publish.

Final words:
That's the tutorial on  how to create a script box in a blog post , if you are still confused, please comment below.

Post a Comment