Documentation Balian

DEMO

Method of Installing Manual Template Code:

Download files sent via email or WhatsApp
Open it using the Winrar or Zip application
Then select the template folder
Select one file type to be installed, .xml to be uploaded directly and notepad replace all and paste it in the Edit HTML. Recommendations (notepad), how to install notepad can be seen here.
Before installing, it's a good idea to first backup the previous template.

URGENT...!!!

Make sure all articles have a label, don't any without a label,
In the Feed make it Full, and
The size of the label text that will be entered in the recent widget must match the label text on the post, if you enter the label text incorrectly, the recent widget will not appear

FORM HEADER

Access your blog Layout - click Edit icon on Option Theme widget

Information

/*FORM SETTINGS*/
var phone = '628123xxxxxx',
    email = 'youremail@gmail.com';

var textadmin = 'Hallo Admin',
	textname = 'Name',
	textphone = 'Mobile Number',
	textemail = 'Email',
	textweb = 'Website',
	textcompany = 'Company',
	textaddress = 'Message',
	textsubject = 'Permission to Ask';

/*RELATED SETTINGS*/
var month = [, "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sept", "Oct", "Nov", "Dec"], // format date
numRelated="6", // number of related
noIMG = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBEI5l29ECHatiE5MRX27V82sM77GzW2xUEIGHX2p4M5pOLwln48tq8WvEIbQ7ez5YkCWUoZnNiD4N6BWuoYhFtk5kLJ0gIm77CUxUh7IKP1WmH7677P486-afvqPE4s6KwSQTUSlaJ9uiRgmS3aQfyZhNJij6oTsXg9ejcurO0x6mTh9JYzurM2hM1To/s16000/noimage.webp";

: Replace with WhatsApp number

: Replace with email address

MENU LEFT

Access your blog Layout - click Edit icon on Link List widget

Normal Link : Dropdown

Sub Link : _Submenu 1

Information: Use menu text format

<i class="ri-dashboard-line"></i><span>Dashboard</span>

: Icon

: Text Menu

Icon please see here https://remixicon.com/

SOCIAL FOOTER

Access your blog Layout - click Edit icon on Social Footer widget.

Icons Avaliables

facebook, twitter, x, rss, tiktok, youtube, skype, tumblr, vk, tack-overflow, github, linkedin, dribbble, soundcloud, behance, instagram, pinterest, twitch, codepen, reddit, whatsapp, snapchat, email, external-link, telegram

LANDING PAGE SETTINGS

LANDING PAGE

Create a page with a title (Landing Page), then publish it without the article content.
If you want to use the old page name, replace the Landing page URL with the desired page link, by entering EDIT HTML and changing the URL/Link below

<b:if cond='data:view.url == data:blog.homepageUrl path &quot;/p/landing-page.html&quot; or data:view.isLayoutMode'>

Replace

INITIAL TEXT

Access your blog Layout - click Edit icon

IMAGE RIGHT

Access your blog Layout - click Edit icon

Information

Image size in demo 284 x 575

BUTTON

Access your blog Layout - click Edit icon

FEATURE LEFT

Access your blog Layout - click Edit icon

FEATURE RIGHT

Access your blog Layout - click Edit icon

COUNTER

Access your blog Layout - click Edit icon

Add a widget and enter the code below

<!-- progress single -->
<div class="progress-single">
<span class="progress-text"><span>348</span>k</span>
<p>Project Completed</p>
</div>
<i class="ri-arrow-right-fill"></i>

Information:

Number

Currency Symbols

<!-- progress single -->
<div class="progress-single">
<span class="progress-text stroked"><span>358</span>k</span>
<p>Project Completed</p>
</div>
<i class="ri-arrow-right-fill"></i>

Additional scripts

VIDEO IFRAME

Access your blog Layout - click Edit icon

<div class='video-youtube' data-embed='H_DsWb0Ou5c'>
<div class='play-button'><i class="ri-play-mini-fill"></i><div class='rot'>PLAY REEL.PLAY REEL.PLAY REEL.</div></div></div>

Information:

Youtube ID

VIDEO TEXT

Access your blog Layout - click Edit icon

TABLE PRICING

Access your blog Layout - click Edit icon

Add a JavaScript/HTML Widget or TEXT Widget and enter the following code

<h4>ProsPack</h4>
<h5>Made for professionals/agencies</h5>

<ul>
<li>Bandwith</li>
<li>Add-On Domains</li>
<li>SSD Storage</li>
<li>Mail Adresses</li>
<li>Support</li>
</ul>

<div class="price-tag">
<span class="symbol">$</span>
<span class="amount">23.99</span>
 <span class="small">/month</span>
</div>

Information:

Replaced

TESTIMONIAL

Access your blog Layout - click Edit icon

Add Image Widget

FAQ

Access your blog Layout - click Edit icon

Add a JavaScript/HTML Widget or TEXT Widget

CONTACT LIST

Access your blog Layout - click Edit icon

Add a JavaScript/HTML Widget or TEXT Widget

ARTICLE SETTING

Meta Descript

Before that, first activate the search description in the Blogger settings section

SOURCE CODE

DROCUP 1

<span class="text-dropcap dcap1">P</span>

DROPCUP 2

<span class="text-dropcap dcap2">P</span>

DROPCUP 3

<span class="text-dropcap dcap3">P</span>

SYNTAX

<pre><code> ...... </code></pre>

BUTTON

<a class="button" href="#">Button</a>
<a class="button red" href="#">red Button</a>
<a class="button orange" href="#">orange Button</a>
<a class="button green" href="#">green Button</a>
<a class="button blue" href="#">blue Button</a>
<a class="button purple" href="#">purple Button</a>
<a class="button yellow" href="#">yellow Button</a>
<a class="button mint" href="#">mint Button</a>
<a class="button aqua" href="#">aqua Button</a>
<a class="button pink" href="#">pink Button</a>
<a class="button white" href="#">white Button</a>
<a class="button grey" href="#">grey Button</a>
<a class="button dark-grey" href="#">dark-grey Button</a>
<a class="button transparent" href="#">Button</a>
<a class="button transparent red" href="#">red Button</a>
<a class="button transparent orange" href="#">orange Button</a>
<a class="button transparent green" href="#">green Button</a>
<a class="button transparent blue" href="#">blue Button</a>
<a class="button transparent purple" href="#">purple Button</a>
<a class="button transparent yellow" href="#">yellow Button</a>
<a class="button transparent mint" href="#">mint Button</a>
<a class="button transparent aqua" href="#">aqua Button</a>
<a class="button transparent pink" href="#">pink Button</a>
<a class="button transparent grey" href="#">grey Button</a>
<a class="button transparent dark-grey" href="#">dark-grey Button</a>
<a class="button" href="#"><i class="fa fa-bolt"></i>Button</a>
<a class="button red" href="#"><i class="fa fa-bookmark"></i>red Button</a>
<a class="button orange" href="#"><i class="fa fa-cart-arrow-down"></i>orange Button</a>
<a class="button green" href="#"><i class="fa fa-bars"></i>green Button</a>
<a class="button blue" href="#"><i class="fa fa-cloud-download"></i>blue Button</a>
<a class="button purple" href="#"><i class="fa fa-fighter-jet"></i>purple Button</a>
<a class="button yellow" href="#"><i class="fa fa-external-link"></i>yellow Button</a>
<a class="button mint" href="#"><i class="fa fa-gavel"></i>mint Button</a>
<a class="button aqua" href="#"><i class="fa fa-life-ring"></i>aqua Button</a>
<a class="button pink" href="#"><i class="fa fa-magic"></i>pink Button</a>
<a class="button white" href="#"><i class="fa fa-location-arrow"></i>white Button</a>
<a class="button grey" href="#"><i class="fa fa-leaf"></i>grey Button</a>
<a class="button dark-grey" href="#"><i class="fa fa-meh-o"></i>dark-grey Button</a>

IFRAME

<div class="inIframe">
<iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="" class="lazyload" frameborder="0" height="315" src="https://www.youtube.com/embed/k5lsM64uMjk" title="YouTube video player" width="560"></iframe></div>

LAZYLOAD

Every time to add an image in an article or anywhere you have to insert the Lazyload Image code in it to speed up loading on the blog

Example:

class="lazyload" data-sizes="auto"

Method of Installing Manual Template Code:

URGENT...!!!

FORM HEADER

MENU LEFT

POPULAR POST & FEATURED

SOCIAL FOOTER

LANDING PAGE SETTINGS

LANDING PAGE

INITIAL TEXT

IMAGE RIGHT

BUTTON

FEATURE LEFT

FEATURE RIGHT

COUNTER

VIDEO IFRAME

VIDEO TEXT

TABLE PRICING

TESTIMONIAL

FAQ

CONTACT LIST

ARTICLE SETTING

Meta Descript

SOURCE CODE

DROCUP 1

DROPCUP 2

DROPCUP 3

SYNTAX

BUTTON

IFRAME

LAZYLOAD

SLOTS IN THE ARTICLE