For world peace, liberate Al-Aqsa, eliminate Israel and anyone who is with Israel, they are the real terrorists
Bacakan

Membuat post icon pack di blogger

Hello sobat ICloudzer kali ini admin bakalan menjabarkan mengenai cara membuat post icon pack di blogger

Info: Jika kamu penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama

Post icon pack

Post icon pack merupakan sebutan untuk menampilkan ICon SVG beserta kode SVG secara bersamaan, biasanya icon park di gunakan untuk memposting artikel mengenai kumpulan svg beserta kode svg, sesuai namanya penggunaan post icon pack sangat di rekomendasikan untuk di gunakan di dalam postingan artikel, namun jika di mungkinkan kami juga bisa menampilkan icon park di body template lainnya

Contoh Tampilan

Silahkan sobat periksa bagaimana sih tampilan dari post ICon park tersebut, silahkan klik gombol di bawah ini untuk mulai memeriksanya

Info: Bagaimana sobat dengan contoh tampilan nya keren sekali yak

Cara oembuatan

Baiklah sobat ICloudzer sekarang saatnya admin bakalan menjabarkan mengenai cara membuat post icon pack khusus pengguna blogger, silahkan baca dan ikuti setiap arahan yang admin jelaskan di bawah ini

  1. Login ke blogger menggunakan akun google milikmu
  2. Kemudian pergi ke menu Tema atau Theme dalam bahasa inggrisnya
  3. Selanjutnya silahkan salin kode CSS di bawah ini kemudian taruh di atas kode ]]><b:skin>
  4. .rahIc{display:flex; position:relative;width:calc(100% + 12px);left:-5px;right:-5px}.rahIc:not(:last-child){margin-bottom:15px}
    .rahIc >*{border:1px solid;background:#f6f6f6;border-radius:10px;color:inherit;direction:ltr; margin:0 5px}
    .rahIc .rahIcl{display:flex;align-items:center;justify-content:center;flex:0 0 55px}
    .rahIc .rahIcl svg{width:26px;height:26px}
    .rahIc .rahIcC{position:relative;overflow:hidden;font-family:'Fira Mono',monospace;flex-grow:1}
    .rahIc .rahIcC::before{content:attr(data-text); display:flex;justify-content:flex-end;position:absolute;top:0;left:0;right:0;background:/*inherit*/#253545;color:/*inherit*/#f2f2f2;font-size:10px;padding:0 10px;z-index:2;line-height:25px}
    .rahIc .rahIcC pre{margin:0;padding:25px 16px 16px; color:/*inherit*/ #f2f2f2; background:/*inherit*/#253545}.drK .rahIc >*{background:#253545}

    Info: Atau sobat bisa menggunakan tag kode <style> untuk meletakkan kode CSS di atas

  5. Kemudian simpan template, dan lanjut kan ke tahapan berikutnya
  6. Selanjutnya untuk menampilkan post icon pack nya silahkan salin dan gunakan kode HTML di bawah ini
  7. <!--[ Activity ]-->
     <div class="rahIc">
    <div class="rahIcl">
     <svg class="line" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
    <g>
     <rect height="20" rx="5" width="20" x="2" y="2">
     </rect>
     <path d="M175.376,181.85188c1.11615-2.25844,2.38586-3.16,3.49436-3.49435,1.91917-.57878,3.21384.58547,5.12781,0a6.13147,6.13147,0,0,0,3.42179-3.4218" transform="translate(-169.39801 -166.39381)">
     </path>
    </g>
     </svg>
    </div>
    <div class="rahIcC" data-text="Activity">
     <pre>&lt;svg class='line' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'&gt;&lt;g&gt;&lt;rect x='2' y='2' width='20' height='20' rx='5'&gt;&lt;/rect&gt;&lt;path d='M175.376,181.85188c1.11615-2.25844,2.38586-3.16,3.49436-3.49435,1.91917-.57878,3.21384.58547,5.12781,0a6.13147,6.13147,0,0,0,3.42179-3.4218' transform='translate(-169.39801 -166.39381)'&gt;&lt;/path&gt;&lt;/g&gt;&lt;/svg&gt;</pre>
    </div>
     </div>
     <!--[ Attachment ]-->
     <div class="rahIc">
    <div class="rahIcl">
     <svg class="line" viewbox="0 0 24 24">
    <path d="M179.38391,179.442a5.02556,5.02556,0,0,0,7.5831.5436l3.01715-3.02a5.031,5.031,0,0,0-7.11042-7.1173l-1.72983,1.72145" transform="translate(-169.39568 -166.4353)">
    </path>
    <path d="M183.40745,177.42863a5.02556,5.02556,0,0,0-7.5831-.5436l-3.01715,3.02a5.031,5.031,0,0,0,7.11042,7.1173l1.71976-1.72145" transform="translate(-169.39568 -166.4353)">
    </path>
     </svg>
    </div>
    <div class="rahIcC" data-text="Attachment">
     <pre>&lt;svg class='line' viewBox='0 0 24 24'&gt;&lt;path d='M179.38391,179.442a5.02556,5.02556,0,0,0,7.5831.5436l3.01715-3.02a5.031,5.031,0,0,0-7.11042-7.1173l-1.72983,1.72145' transform='translate(-169.39568 -166.4353)'&gt;&lt;/path&gt;&lt;path d='M183.40745,177.42863a5.02556,5.02556,0,0,0-7.5831-.5436l-3.01715,3.02a5.031,5.031,0,0,0,7.11042,7.1173l1.71976-1.72145' transform='translate(-169.39568 -166.4353)'&gt;&lt;/path&gt;&lt;/svg&gt;</pre>
    </div>
     </div>
    <!--[ Calendar ]-->
     <div class="rahIc">
    <div class="rahIcl">
     <svg class="line" viewbox="0 0 24 24">
    <rect height="18" rx="5" width="20" x="2" y="4">
    </rect>
    <line x1="16.59341" x2="16.59341" y1="5.84619" y2="2">
    </line>
    <line x1="7.40659" x2="7.40659" y1="5.84619" y2="2">
    </line>
    <line x1="2" x2="22" y1="9" y2="9">
    </line>
     </svg>
    </div>
    <div class="rahIcC" data-text="Calendar">
     <pre>&lt;svg class='line' viewBox='0 0 24 24'&gt;&lt;rect x='2' y='4' width='20' height='18' rx='5'&gt;&lt;/rect&gt;&lt;line x1='16.59341' y1='5.84619' x2='16.59341' y2='2'&gt;&lt;/line&gt;&lt;line x1='7.40659' y1='5.84619' x2='7.40659' y2='2'&gt;&lt;/line&gt;&lt;line x1='2' y1='9' x2='22' y2='9'&gt;&lt;/line&gt;&lt;/svg&gt;</pre>
    </div>
    </div>
    <!--[ Bag ]-->
    <div class="rahIc">
    <div class="rahIcl">
     <svg class="line" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
    <g>
     <path d="M185.404,189.43193h-8.01673a5.98982,5.98982,0,0,1-5.88763-7.09154l.86727-4.63469a5.98982,5.98982,0,0,1,5.88763-4.8881h6.28219a5.98983,5.98983,0,0,1,5.88763,4.8881l.86727,4.63469A5.98982,5.98982,0,0,1,185.404,189.43193Z" transform="translate(-169.39562 -167.43193)">
     </path>
     <line x1="14.71978" x2="9.28022" y1="16.69283" y2="16.69283">
     </line>
     <line x1="15.97802" x2="14.71978" y1="7.64835" y2="2">
     </line>
     <line x1="8.02198" x2="9.28022" y1="7.64835" y2="2">
     </line>
    </g>
     </svg>
    </div>
    <div class="rahIcC" data-text="Bag">
     <pre>&lt;svg class='line' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'&gt;&lt;g&gt;&lt;path d='M185.404,189.43193h-8.01673a5.98982,5.98982,0,0,1-5.88763-7.09154l.86727-4.63469a5.98982,5.98982,0,0,1,5.88763-4.8881h6.28219a5.98983,5.98983,0,0,1,5.88763,4.8881l.86727,4.63469A5.98982,5.98982,0,0,1,185.404,189.43193Z' transform='translate(-169.39562 -167.43193)'&gt;&lt;/path&gt;&lt;line x1='14.71978' y1='16.69283' x2='9.28022' y2='16.69283'&gt;&lt;/line&gt;&lt;line x1='15.97802' y1='7.64835' x2='14.71978' y2='2'&gt;&lt;/line&gt;&lt;line x1='8.02198' y1='7.64835' x2='9.28022' y2='2'&gt;&lt;/line&gt;&lt;/g&gt;&lt;/svg&gt;</pre>
    </div>
     </div>
     <!--[ Category ]-->
     <div class="rahIc">
    <div class="rahIcl">
     <svg class="line" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
    <g>
     <circle cx="17.47857" cy="17.49096" r="4.5">
     </circle>
     <circle cx="6.50904" cy="6.52143" r="4.5">
     </circle>
     <circle cx="5.00904" cy="18.99096" r="3">
     </circle>
     <circle cx="18.99096" cy="5.00904" r="3">
     </circle>
    </g>
     </svg>
    </div>
    <div class="rahIcC" data-text="Category">
     <pre>&lt;svg class='line' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'&gt;&lt;g&gt;&lt;circle cx='17.47857' cy='17.49096' r='4.5'&gt;&lt;/circle&gt;&lt;circle cx='6.50904' cy='6.52143' r='4.5'&gt;&lt;/circle&gt;&lt;circle cx='5.00904' cy='18.99096' r='3'&gt;&lt;/circle&gt;&lt;circle cx='18.99096' cy='5.00904' r='3'&gt;&lt;/circle&gt;&lt;/g&gt;&lt;/svg&gt;</pre>
    </div>
    </div> 

    Info: Silahkan gunakan saat ingin memposting artikel menggunakan mode HTML bukan mode Compose (menulis)



<svg class='line' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g><rect x='2' y='2' width='20' height='20' rx='5'></rect><path d='M175.376,181.85188c1.11615-2.25844,2.38586-3.16,3.49436-3.49435,1.91917-.57878,3.21384.58547,5.12781,0a6.13147,6.13147,0,0,0,3.42179-3.4218' transform='translate(-169.39801 -166.39381)'></path></g></svg>
<svg class='line' viewBox='0 0 24 24'><path d='M179.38391,179.442a5.02556,5.02556,0,0,0,7.5831.5436l3.01715-3.02a5.031,5.031,0,0,0-7.11042-7.1173l-1.72983,1.72145' transform='translate(-169.39568 -166.4353)'></path><path d='M183.40745,177.42863a5.02556,5.02556,0,0,0-7.5831-.5436l-3.01715,3.02a5.031,5.031,0,0,0,7.11042,7.1173l1.71976-1.72145' transform='translate(-169.39568 -166.4353)'></path></svg>
<svg class='line' viewBox='0 0 24 24'><rect x='2' y='4' width='20' height='18' rx='5'></rect><line x1='16.59341' y1='5.84619' x2='16.59341' y2='2'></line><line x1='7.40659' y1='5.84619' x2='7.40659' y2='2'></line><line x1='2' y1='9' x2='22' y2='9'></line></svg>
<svg class='line' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g><path d='M185.404,189.43193h-8.01673a5.98982,5.98982,0,0,1-5.88763-7.09154l.86727-4.63469a5.98982,5.98982,0,0,1,5.88763-4.8881h6.28219a5.98983,5.98983,0,0,1,5.88763,4.8881l.86727,4.63469A5.98982,5.98982,0,0,1,185.404,189.43193Z' transform='translate(-169.39562 -167.43193)'></path><line x1='14.71978' y1='16.69283' x2='9.28022' y2='16.69283'></line><line x1='15.97802' y1='7.64835' x2='14.71978' y2='2'></line><line x1='8.02198' y1='7.64835' x2='9.28022' y2='2'></line></g></svg>
<svg class='line' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g><circle cx='17.47857' cy='17.49096' r='4.5'></circle><circle cx='6.50904' cy='6.52143' r='4.5'></circle><circle cx='5.00904' cy='18.99096' r='3'></circle><circle cx='18.99096' cy='5.00904' r='3'></circle></g></svg>


About the Author

Keindahanmu akan kuabadikan disetiap karyaku.

إرسال تعليق

Menghasilkan uang melalui survei berbayar
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.