plan

Navigation Menu

  • Home
  • Dropdown Menu
  • _Menu item 1
  • _Menu item 2
  • _Sub Menu
  • __Item 1
  • __Item 2
  • _Menu item 3
  • Error Page
  • Documentation
  • Follow us

How to Make Html Parse Tools or Convert Ad Code Script on Blogger

DEV by DEV   in Design 0 comments
How to Make Html Parse Tools or Convert Ad Code Script on Blogger

For a Blogger, the presence of the parse tool is considered very useful, especially to help insert HTML script code in posts or articles on a site.

Check out the demo

How to make

  1. Open your Blogger dashboard first.
  2. Then select the  "Pages" menu.
  3. Next, create a new page by clicking the "New Page" button at the top.
  4. Later there will be two mode choices, namely Compose and HTML. If you want to write the opening paragraph then please select compose mode first, then select HTML mode to put the code.
  5. Then copy and paste the code for the HTML parse tool maker script below.

Here's the code


<style scoped="" type="text/css">
#parser2{position:relative;overflow:hidden}
#parser2 .btn,#parser2 .btn:active{background-image:none}
#parser2 .btn{font-weight:400;padding:6px 12px;margin-bottom:5px;font-size:14px;line-height:1.42857143;text-align:center;white-space:nowrap;-ms-touch-action:manipulation;touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:0;border-radius:4px;cursor:pointer;transition:all .3s}
#parser2 .btn:active:focus,#parser2 .btn:focus{outline:0}
#parser2 .btn:focus,#parser2 .btn:hover{color:#333;text-decoration:none;outline:0}
#parser2 .btn:active{outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}
#parser2 .btn-primary{color:#fff;background:#3e51b5}
#parser2 .btn-primary:focus,.button-group button:disabled{color:#fff;background:#286090}
#parser2 .btn-primary:active,#parser2 .btn-primary:hover{color:#fff;opacity:.9}
#parser2 .btn-danger{color:#fff;background:#f39c12}
#parser2 .btn-danger:focus{color:#fff;opacity:.9}
#parser2 .btn-danger:active,#parser2 .btn-danger:hover{color:#fff;opacity:.9}
#parser2 .btn-info{color:#fff;background:#5bc0de}
#parser2 .btn-info:focus{color:#fff;background:#31b0d5}
#parser2 .btn-info:active,#parser2 .btn-info:hover{color:#fff;background:#31b0d5}
#parser2 .btn-xs{font-size:12px;line-height:1.5;border-radius:3px;padding:1px 5px}
#parser2 textarea#somewhere{border:1px solid rgba(0,0,0,0.05);height:300px;width:100%;margin:0 0 10px;box-sizing:border-box;font-family:Consolas,Monaco,'Andale Mono',monospace;color:#111;border-radius:8px;padding:20px;transition:all .6s}
#parser2 textarea#somewhere:active,#parser2 textarea#somewhere:focus{border-color:rgba(0,0,0,0.15);outline:0}
#parser2 .btn-sm{display:inline-block;font-size:13px;line-height:1.5;border-radius:5px;padding:12px;margin:0 auto 10px auto;width:30%;box-shadow:0 3px 1.2rem -0.8rem rgba(0,0,0,0.8)}
#parser2 .btn-xs{font-size:13px;line-height:1.5;border-radius:5px;padding:12px;margin:auto;width:30%;box-shadow:0 3px 1.2rem -0.8rem rgba(0,0,0,0.8)}
.collapse{display:none}
.alert-success{color:#222;background:#fff}
.alert{border:0;padding:5px 15px;border-radius:10px;position:absolute;top:20px;right:20px;min-width:210px;color:#0984e3;font-size:13px;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16)}
button.close{padding:0;cursor:pointer;background:none;border:0;-webkit-appearance:none}
.close{float:right;font-size:1.3rem;color:#0984e3;margin:1px 0 0 0}
button.close:focus{outline:0}
.close:hover{opacity:1!important}
#btnInfo h4{margin:0;font-size:13px;line-height:2}
#button-link{display:none}
.clear{clear:both;display:block;margin-bottom:2px}
.alert br{display:none}
</style>
<br />
<div id="parser2"><textarea id="somewhere" placeholder="Write/paste the code here then click the Parse Code button"></textarea><br />
<div class="alert alert-success margin-bottom-20 collapse" id="btnInfo" role="alert"><button class="close close-copy" onclick="document.getElementById(&quot;btnInfo&quot;).style.display = &quot;none&quot;;cdClear();" type="button"><span aria-hidden="true">&#215;</span></button> <br />
<h4>Code copied to clipboard</h4></div><button class="btn btn-primary btn-sm btn-parse" onclick="convert();" type="button">Parse Code</button> <br />
<div class="clear"></div><button class="btn button-link btn-xs btn-info" data-clipboard-action="copy" data-clipboard-target="#somewhere" id="button-link" type="submit">Copy code to clipboard</button> <button class="btn btn-danger btn-xs" id="btn_clear" onclick="cdClear();">Clean</button> </div>
<script type="text/javascript">//<![CDATA[
function downloadJSAtOnload(){var d=document.createElement("script");d.src="https://cdn.jsdelivr.net/gh/Arlina-Design/redvision@master/htmlparse.js",document.body.appendChild(d)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]></script>


6. Finally, please click Save

How to Make Html Parse Tools or Convert Ad Code Script on Bloggers like Arlinacode

Image Step 1

Image Step 2

Note:

You can modify the appearance independently of this HTML parse tool, for example, you can change the theme or size of the HTML parse tool box according to your own taste.
Check out the demo
Design
Share on FacebookShare on Twitter
DEV

DEV

Related posts

No hay comentarios.:

Publicar un comentario

Entrada más reciente Entrada antigua Página Principal
Suscribirse a: Comentarios de la entrada (Atom)

Advertisement

Popular Posts

  • How to Make Html Parse Tools or Convert Ad Code Script on Blogger
    For a Blogger, the presence of the parse tool is considered very useful, especially to help insert HTML script code in posts or articles on ...
  • Big Tech Execs and Bitcoin: Skype Cofounder Keeps Personal Wealth in Crypto, Intercom Chairman ‘Firmly Jumps on the Bitcoin Wagon’
      This week two well known tech executives revealed they have been dabbling in bitcoin and other cryptocurrencies. In a recent interview, Sk...
  • Invert Mini 480 Safelink Blogger Template
    Description Invert Mini 480 Safelink is a premium template Invert Pro modified by one of the Aliva Redesign. Mini 480 already supports respo...
  • Update Free Fletro Link 54+ Redesign Responsive Belogger Template
    Description Fletro Link 54+ Redesign is a blogger template The appearance is made modern and elegant in terms of features or layout of the t...
  • Free Fletro Pro v.5.5 Safelink Template Blogger Responsive
    In this Fletro Pro v.5.5 update, the focus is on simplifying the appearance of the template and providing more space and margins so that the...
  • JagoMag 2 The Ultimate Magazine Blogger Template
    Description Jago Mag is the fast loading magazine blogger template as well as. It also supports an unlimited color option to change the temp...
  • Asal-seo Redesign v3 Responsive Blogger Template
    Description Asal-seo Redesign v3 Responsive Blogger Template - This time Netralid.com will share Nikami.co Editing templates in Use Now. Th...

Pages

  • Home

Labels

  • Art Marketing (5)
  • Bitcoin (2)
  • Blog (23)
  • Blogger (23)
  • Business (9)
  • Carousel (3)
  • Clone (4)
  • Design (7)
  • Entertainment (2)
  • Featured (4)
  • Friends (5)
  • Home (2)
  • Lifestyle (5)
  • Magazine (23)
  • People (4)
  • Redesign (11)
  • related (22)
  • Safelink (3)
  • Slider (4)
  • Sport (3)
  • Technology (4)
  • Template (9)
  • Training (4)

Blog Archive

  • ►  2021 (6)
    • ►  enero (6)
  • ▼  2020 (19)
    • ►  diciembre (10)
    • ▼  noviembre (8)
      • Micin Redesign Responsive Blogger Template
      • Big Tech Execs and Bitcoin: Skype Cofounder Keeps ...
      • Asal-seo Redesign v3 Responsive Blogger Template
      • Want to Know What is Bitcoin? The advantages and r...
      • How to Make Html Parse Tools or Convert Ad Code Sc...
      • Vietnamese Theme Redesign Blogger Template
      • Clone Gomsite + Redesign style 2 Blogger Template
      • Redesign Vio-magz v Landing Responsive Blogger Tem...
    • ►  enero (1)
  • ►  2019 (6)
    • ►  agosto (3)
    • ►  junio (2)
    • ►  mayo (1)
  • ►  2018 (18)
    • ►  octubre (2)
    • ►  septiembre (2)
    • ►  mayo (8)
    • ►  abril (6)
  • ►  2017 (22)
    • ►  octubre (1)
    • ►  septiembre (1)
    • ►  abril (1)
    • ►  marzo (19)

About Me

Mi foto
DEV
Ver mi perfil completo
  • HOME
  • ABOUT
  • SERVICES
  • CONTACT
  • PRIVACY

  • Home
  • _Home 1
  • _Home 2
  • Pages
  • _About
  • _Contact
  • _Services
  • Sport
  • Policy
  • Features
  • _Submenu 1
  • _Submenu 2
  • _Submenu 3
  • _Submenu 4
  • _Submenu 5
  • _Submenu 6
  • _Submenu 7
  • Error Page
  • Lifestyle

Categories

Art Marketing Bitcoin Blog Blogger Business Carousel Clone Design Entertainment Featured Friends Home Lifestyle Magazine People Redesign related Safelink Slider Sport Technology Template Training

Phasellus deserunt. Convallis perspiciatis fusce fermentum accumsan, arcu aliquam, velit venenatis augue proin, enim etiam dolor. Mi ac lectus vitae cum, fusce purus posuere.

About

  • Home
  • Lifestyle
  • People
  • Slider
  • Sport

Account

  • Business
  • Design
  • Entertainment
  • Featured
  • Technology

Páginas

Slider

[Home][fbt-slider][1][Continue Reading...]

Formulario de contacto

Nombre

Correo electrónico *

Mensaje *

Short Codes

[full_Screen]

© plan. All rights reserved.

| ThemeDaddy - Best Themes Everytime!