Ümit Tunç
249 lines
12 KiB
HTML
249 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<title>Doc - Blogzine Theme</title>
|
||
<!-- Meta Tags -->
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||
<meta name="author" content="Webestica.com">
|
||
|
||
<!-- Favicon -->
|
||
<link rel="shortcut icon" href="assets/images/favicon.ico">
|
||
|
||
<!-- Google Font -->
|
||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||
<link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;700&family=Rubik:wght@400;500;700&display=swap" rel="stylesheet">
|
||
|
||
<!-- Plugins CSS -->
|
||
<link rel="stylesheet" type="text/css" href="assets/vendor/font-awesome/css/all.min.css">
|
||
|
||
<!-- Theme CSS -->
|
||
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
|
||
<link rel="stylesheet" type="text/css" href="assets/css/doc.css">
|
||
<link rel="stylesheet" type="text/css" href="assets/css/prism.css">
|
||
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<!-- **************** MAIN CONTENT START **************** -->
|
||
<main>
|
||
<!-- Navbar top START -->
|
||
<div class="navbar-top bg-dark px-3 px-sm-4 px-md-5">
|
||
<div class="d-flex justify-content-between align-items-center">
|
||
<!-- Logo START -->
|
||
<a class="navbar-brand py-3" href="index.html">
|
||
<img class="navbar-brand-item" src="assets/images/logo.svg" alt="logo">
|
||
</a>
|
||
<!-- Logo END -->
|
||
|
||
<!-- Navbar right -->
|
||
<div>
|
||
<ul class="text-end list-inline m-0">
|
||
<li class="list-inline-item me-2 me-md-4"> <a class="text-white" href="https://blogzine.webestica.com">Live Preview</a> </li>
|
||
<li class="list-inline-item me-2 me-md-4"> <a class="text-white" href="https://support.webestica.com" target="_blank">Support</a> </li>
|
||
<li class="list-inline-item text-white"> <span class="badge bg-danger text-white">v1.2.0</span></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Navbar top END -->
|
||
|
||
<div class="container-fluid px-0">
|
||
<div class="page-wrapper">
|
||
<!-- Left sidebar START -->
|
||
<nav class="navbar navbar-expand-sm navbar-light bg-light px-3">
|
||
<a class="navbar-brand py-2 d-sm-none" href="#">Doc nav</a>
|
||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#docNav" aria-controls="docNav" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-icon"></span>
|
||
</button>
|
||
<div class="collapse navbar-collapse" id="docNav">
|
||
<div class="left-sidebar bg-light">
|
||
<div class="content h-100vh">
|
||
<div class="list-group list-group-borderless p-3 p-md-4">
|
||
<b class="text-dark text-uppercase mb-2">Getting Started</b>
|
||
<a class="list-group-item" href="index.html">Introduction</a>
|
||
<a class="list-group-item" href="gulp.html">Gulp</a>
|
||
<a class="list-group-item" href="customization.html">Customization</a>
|
||
<a class="list-group-item" href="color-scheme.html">Color Scheme</a>
|
||
<a class="list-group-item" href="logo-settings.html">Logo Settings</a>
|
||
<a class="list-group-item" href="page-loading.html">Page Loading</a>
|
||
<a class="list-group-item" href="fonts.html">Fonts</a>
|
||
<a class="list-group-item" href="dark-mode.html">Dark mode</a>
|
||
<a class="list-group-item" href="rtl.html">RTL Version</a>
|
||
<a class="list-group-item" href="lazy-load.html">Lazy Load</a>
|
||
<a class="list-group-item" href="sources-and-credits.html">Sources and Credits</a>
|
||
<a class="list-group-item" href="changelog.html">Changelog</a>
|
||
<a class="list-group-item" href="updates.html">Updates</a>
|
||
<a class="list-group-item" href="support.html">Support</a>
|
||
<b class="text-dark text-uppercase mt-3 mb-2">Component</b>
|
||
<a class="list-group-item" href="alerts.html">Alerts</a>
|
||
<a class="list-group-item" href="avatar.html">Avatar</a>
|
||
<a class="list-group-item" href="badges.html">Badges</a>
|
||
<a class="list-group-item" href="breadcrumb.html">Breadcrumb</a>
|
||
<a class="list-group-item" href="buttons.html">Buttons</a>
|
||
<a class="list-group-item" href="card.html">Card</a>
|
||
<a class="list-group-item" href="font-icons.html">Font icons</a>
|
||
<a class="list-group-item" href="google-map.html">Google Map</a>
|
||
<a class="list-group-item" href="nav-and-tabs.html">Nav and Tabs</a>
|
||
<a class="list-group-item" href="pagination.html">Pagination</a>
|
||
<a class="list-group-item" href="progress.html">Progress</a>
|
||
<a class="list-group-item" href="sticky-element.html">Sticky element</a>
|
||
<a class="list-group-item" href="sticky-footer.html">Sticky footer</a>
|
||
<a class="list-group-item" href="utility-classes.html">Utility classes</a>
|
||
<b class="text-dark text-uppercase mt-3 mb-2">Plugins</b>
|
||
<a class="list-group-item" href="tiny-slider.html">Tiny Slider</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<!-- Left sidebar END -->
|
||
|
||
<!-- Main content START -->
|
||
<div class="main-content">
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<!-- Page title -->
|
||
<div class="my-5">
|
||
<h2>Introduction</h2>
|
||
<p class="lead">Get started with Blogzine by following this guide, It will help you to get the most out of our Bootstrap Theme quickly with easy understanding.</p>
|
||
<div class="py-1 bg-light-overlay-dotted "></div>
|
||
</div>
|
||
|
||
<!-- Page content -->
|
||
<p class="lead">Thank you for purchasing Blogzine theme! Before proceeding with the theme installation, It is recommended that you follow the steps listed in this guide. We have covered all kinds of necessary information, and provide you with all the guidelines and details that you will need to use Blogzine theme. If you can't find the answer you’re looking for, We encourage you to reach to us through our support portal. We'll be glad to help you out with your queries. Please generate ticket through our <a href="https://support.webestica.com" target="_blank">support portal</a> and you shall hear back very soon. </p>
|
||
|
||
<!-- Directory structure -->
|
||
<h3 id="directory" class="pt-5">Directory structure</h3>
|
||
<p>Once you have downloaded the package after theme extracting, you will see the following files & folder structure:</p>
|
||
<ul class="list-unstyled">
|
||
<!-- template folder -->
|
||
<li>
|
||
<dl>
|
||
<dt><i class="fas fa-folder-open text-warning me-1"></i> template </dt>
|
||
<dd> Includes all assets and template files, used in theme</dd>
|
||
</dl>
|
||
<ul class="list-unstyled ms-4">
|
||
<dl>
|
||
<dt> <i class="fas fa-folder-open text-warning me-1"></i> docs </dt>
|
||
<dd>Includes theme's documentation files (on theme editing and setup).</dd>
|
||
</dl>
|
||
<ul class="list-unstyled ms-4">
|
||
<dl>
|
||
<dt> <i class="fas fa-file text-warning me-1"></i> index.html </dt>
|
||
<dd>Main documentation file. You are reading it at the moment.</dd>
|
||
</dl>
|
||
</ul>
|
||
<dl>
|
||
<dt><i class="fas fa-folder-open text-warning me-1"></i> assets </dt>
|
||
<dd> Includes all assets files, like CSS, Images, JS, SCSS and plugins used in theme</dd>
|
||
</dl>
|
||
<ul class="list-unstyled ms-4">
|
||
<dl>
|
||
<dt><i class="fas fa-folder text-warning me-1"></i> css </dt>
|
||
<dd> Includes .css file, used in theme</dd>
|
||
</dl>
|
||
<li>
|
||
<dl>
|
||
<dt><i class="fas fa-folder text-warning me-1"></i> images</dt>
|
||
<dd> Includes all images, used in .html files.</dd>
|
||
</dl>
|
||
</li>
|
||
<li>
|
||
<dl>
|
||
<dt><i class="fas fa-folder text-warning me-1"></i> js</dt>
|
||
<dd> Includes plugin's initialization file</dd>
|
||
</dl>
|
||
</li>
|
||
<li>
|
||
<dl>
|
||
<dt><i class="fas fa-folder text-warning me-1"></i> scss</dt>
|
||
<dd> Includes all of raw source files that are used to create the final CSS that is included in theme</dd>
|
||
</dl>
|
||
</li>
|
||
<li>
|
||
<dl>
|
||
<dt><i class="fas fa-folder text-warning me-1"></i> vendor</dt>
|
||
<dd> Includes all plugins files.</dd>
|
||
</dl>
|
||
</li>
|
||
</ul>
|
||
<li>
|
||
<dl>
|
||
<dt><i class="fas fa-file text-warning me-1"></i> index.html</dt>
|
||
<dd> You will find here all .html files used in theme</dd>
|
||
</dl>
|
||
</li>
|
||
</ul>
|
||
|
||
</li>
|
||
<li>
|
||
<dl>
|
||
<dt> <i class="fas fa-file text-warning me-1"></i> gulpfile.js </dt>
|
||
<dd>All the build commands</dd>
|
||
</dl>
|
||
<dl>
|
||
<dt> <i class="fas fa-file text-warning me-1"></i> package.json </dt>
|
||
<dd>List of dependencies and npm information</dd>
|
||
</dl>
|
||
<dl>
|
||
<dt> <i class="fas fa-file text-warning me-1"></i> package-lock.json </dt>
|
||
<dd>Lock dependencies to a specific version number to avoid possible version mismatch.</dd>
|
||
</dl>
|
||
<dl>
|
||
<dt> <i class="fas fa-file text-warning me-1"></i> README.MD</dt>
|
||
<dd></dd>
|
||
</dl>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-12 mt-5">
|
||
<h3 class="mb-4">What to do after purchase?</h3>
|
||
<h6>1. Check theme inside out</h6>
|
||
<p>After extracting .zip file, check every file and folder to know more about theme inside out. Confused with any file/folder usage? Check <a href="#directory" class="text-dark"><u>above directory</u></a> structure to clear your doubts. We recommended reading the whole documentation for better understanding of theme. Yes, it will take up to 30 min but it worth reading.</p>
|
||
|
||
<h6>2. Install local environment for customization (Optional but highly recommended)</h6>
|
||
<p>Go to <a href="gulp.html">Gulp section</a> and follow the steps. You can skip this step if you prefer to work with Blogzine as a static source without Gulp and Sass.</p>
|
||
|
||
<h6>3. Branding</h6>
|
||
<p>After installation and running gulp, change your brand colors buy following <a href="color-scheme.html">Color scheme section</a> instructions. Change your brand logo by following <a href="logo-settings.html">Logo settings section</a></p>
|
||
|
||
<h6>4. Customization</h6>
|
||
<p>Now you can start customizing your website as per your need. </p>
|
||
|
||
<h6>5. Delete unnecessary file and folder to upload on live server</h6>
|
||
<p>After completing your website, you must need to delete unnecessary file and folder to reduce website size. Please check below folders/files usage to run your website:</p>
|
||
<ul>
|
||
<li class="mb-1"><b>assets/css:</b> You must need style.css (or style-rtl.scss for RTL version). If you have not used color.css file then you can remove it.</li>
|
||
<li class="mb-1"><b>assets/images:</b> You can remove all unnecessary files from this folder.</li>
|
||
<li class="mb-1"><b>assets/js:</b> Don't delete this folder/file.</li>
|
||
<li class="mb-1"><b>assets/scss:</b> If you don't want sourcemap you can remove SCSS folder. You must remove source map comment from the end of the style.css (or style-rtl.scss for RTL version) file to avoid warning on console log.</li>
|
||
<li class="mb-1"><b>assets/vendor:</b> Keep only those vendor folders that you have used in your website.</li>
|
||
<li class="mb-1"><b>node_modules:</b> You only need this folder for local server. Don't upload it to live server.</li>
|
||
<li class="mb-1"><b>docs:</b> You don't need docs folder for your live website.</li>
|
||
</ul>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Main content END -->
|
||
</div>
|
||
</div>
|
||
</main>
|
||
|
||
<!-- =======================
|
||
JavaScripts -->
|
||
|
||
<!-- Bootstrap JS -->
|
||
<script src="assets/js/bootstrap.bundle.min.js"></script>
|
||
|
||
<script src="assets/js/simple-scrollbar.min.js"></script>
|
||
<script src="assets/js/prism.js"></script>
|
||
<script src="assets/js/clipboard.min.js"></script>
|
||
|
||
<!-- Template Functions -->
|
||
<script src="assets/js/functions.js"></script>
|
||
|
||
</body>
|
||
</html> |