To edit HTML files, software needed are text editors like Sublime Text, Notepad++, or Dreamweaver.
Sublime Text download: https://www.sublimetext.com/downloadNotepad++ download: https://notepad-plus-plus.org/downloads
Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, please feel free to ask via item's comments. Also if you love this item please don't forget to give item ratings. It would be very meaningful for us. Thanks so much! :)
To edit HTML files, software needed are text editors like Sublime Text, Notepad++, or Dreamweaver.
Sublime Text download: https://www.sublimetext.com/download... header area ...
<div id="content">
<div class="container">
<div class="row">
<div class="col-md-4">
this is your content
</div>
<div class="col-md-8">
this is your content
</div>
</div>
</div>
<section>
<div class="container">
<div class="row">
this is your content
</div>
</div>
</section>
</div>
... footer area ...
For a simple two column layout, create a .row and add the appropriate number of .col-md-* columns. As this is a 12-column grid, each .col-md-* spans a number of those 12 columns, and should always add up to 12 for each row (or the number of columns in the parent).
Please read more for Bootstrap grid system here: https://getbootstrap.com/docs/5.0/layout/columns/
<div class="row">
<div class="col-md-6"> this is 1/2 columns </div>
<div class="col-md-6"> this is 1/2 columns </div>
</div> <div class="row">
<div class="col-md-4"> this is 1/3 columns </div>
<div class="col-md-8"> this is 2/3 columns </div>
</div> <div class="row">
<div class="col-md-3"> this is 1/4 columns </div>
<div class="col-md-9"> this is 3/4 columns </div>
</div>
To change text direction to RTL for whole pages on this template is very easy. You just need change one setting in file designesia.js. Change var rtl_mode to 'on'.
var rtl_mode = 'on'; // on - for enable RTL, off - for deactive RTL
To use grey scheme style you must add de-grey.css to page head
<link href="css/de-grey.css" rel="stylesheet" type="text/css" />
Then insert class name de-grey to body tag
<body class="dark-scheme de-grey">
For each template page, look at line 25 below
<link id="colors" href="css/colors/scheme-01.css" rel="stylesheet" type="text/css">
Replace scheme-01.css with another value. You can choose one of below: scheme-01.css, scheme-02.css, scheme-03.css, scheme-04.css.
All premade color on this template can be found inside folder css/colors/.
Select an object that you want to animate. As example you want create animate for H1 element. You can see below:
<h1 class="wow fadeIn" data-wow-delay=".2s" data-wow-duration=".5s">Animate Text</h1>
To make custom background color without touching css file, you can use code data-bgcolor="#hex-color" within your div/section tag. See sample below:
<div data-bgcolor="#333333">
my div content...
</div>
To make custom background image without touching css file, you can use code data-bgimage="url(your-image-url)" within your div/section tag. See sample below:
<div data-bgimage="url(images/background/bg-1.jpg)">
my div content...
</div>
To add cookie consent on any page, you can insert code below before end of body tag </body>
<!-- COOKIES NOTICE -->
<script src="js/cookit.js"></script>
<script>
$(document).ready(function() {
$.cookit({
backgroundColor: '#101010',
messageColor: '#fff',
linkColor: '#FEF006',
buttonColor: '#FEF006',
messageText: "This website uses cookies to ensure you get the best experience on our website.",
linkText: "Learn more",
linkUrl: "index.html",
buttonText: "I accept",
});
});
</script>