“Redias” Documentation by “DynamicLayers” v1.0


“Redias”

Created: 01/04/2023
By: DynamicLayers


Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, please contact our support. Thanks so much!


Table of Contents

  1. HTML Structure
  2. Template Components
  3. CSS Files and Structure
  4. JavaScript
  5. Sources and Credits
  6. PHP Code Explanation (If your theme uses PHP)

A) HTML Structure - top

Below is the general HTML structure of the landing page.

1) index.html File Structure - top

The template page's layout consist of top that show the logo and main menu, hero section that show background image, beforecontent that show some amaizing content, about section contain about your some info & feature, service section contained all services, work section you can showcase your portfolio with awesome animation, skills section here you can add some skills, team section is for your team members, testimonial section here you can published your customer reviews, call to action this for call to action content, contact section here you can put your contact information & footer that show copyright information.

<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="Redias Creative Digital Agency HTML5 Template">
    <meta name="author" content="DynamicLayers">

    <title>Redias | Creative Digital Agency HTML5 Template</title>

    <link rel="shortcut icon" type="image/x-icon" href="assets/img/favicon.png">

    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/animate.min.css">
    <link rel="stylesheet" href="assets/css/fontawesome.min.css">
    <link rel="stylesheet" href="assets/css/line-awesome.min.css">
    <link rel="stylesheet" href="assets/css/redias-icons.css">
    <link rel="stylesheet" href="assets/css/odometer.min.css">
    <link rel="stylesheet" href="assets/css/venobox.min.css">
    <link rel="stylesheet" href="assets/css/keyframe-animation.css">
    <link rel="stylesheet" href="assets/css/swiper.min.css">
    <link rel="stylesheet" href="assets/css/main.css">

</head>

<body>
    <!--[if lt IE 8]>
        <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
    <![endif]-->

    <div class="site-preloader">
        <div class="spinner"></div>
    </div>
    <!--site preloader-->

    <header class="header-wrapper">
        
    </header>
    <!--/.main-header-->

    <div id="popup-sidebox" class="popup-sidebox">
        
    </div>
    <!--/.popup-sidebox-->

    <section class="hero-section">
        
    </section>
    <!--/.hero-section-->

    <div class="slider-section bg-grey padding-bottom">
        
    </div>
    <!--/.slider-section-->

    <section class="about-section padding">
        
    </section>
    <!--/.about-section-->

    <section class="service-section bg-grey padding">
        
    </section>
    <!--/.services-section-->

    <section class="project-section bg-grey padding">
        
    </section>
    <!--/.project-section-->

    <section class="testimonial-section padding">
        
    </section>
    <!--/.testimonial-section-->

    <section class="counter-section bg-dark">
        
    </section>
    <!--/.counter-section-->

    <section class="skill-section">
        
    </section>
    <!--/.skill-section-->

    <div class="sponsor-section padding">
        
    </div><!-- /.sponsor-section -->

    <section class="short-promo">
        
    </section>
    <!--/.short-promo-->

    <section class="cta-section">
        
    </section>
    <!--/.cta-section-->

    <section class="team-section padding">
        
    </section>
    <!--/.team-section-->

    <section class="blog-section bg-grey padding">
        
    </section>
    <!--/.blog-section-->

    <section class="call-back-section padding">
        
    </section>
    <!--/.call-back-section-->

    <section class="feed-section bg-grey padding">
        
    </section>
    <!--/.feed-section-->

    <footer class="footer-wrapper">
        
    </footer><!-- /.footer-wrapper -->
    
    <div id="scrollup">
        <button id="scroll-top" class="scroll-to-top">
            <i class="las la-arrow-up"></i>
        </button>
    </div>
    <!--scrollup-->

    <!--jQuery Lib-->
    <script src="assets/js/vendor/jquary-3.6.0.min.js"></script>
    <script src="assets/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
    <script src="assets/js/vendor/jquery.ajaxchimp.min.js"></script>
    <script src="assets/js/vendor/bootstrap.min.js"></script>
    <script src="assets/js/vendor/popper.min.js"></script>
    <script src="assets/js/vendor/odometer.min.js"></script>
    <script src="assets/js/vendor/waypoints.min.js"></script>
    <script src="assets/js/vendor/venobox.min.js"></script>
    <script src="assets/js/vendor/swiper.min.js"></script>
    <script src="assets/js/vendor/smooth-scroll.js"></script>
    <script src="assets/js/vendor/chart.min.js"></script>
    <script src="assets/js/vendor/wow.min.js"></script>
    <script src="assets/js/contact.js"></script>
    <script src="assets/js/main.js"></script>

</body>

</html>


        

B) Template Components - top

The site is made of many sections like header, slider, testimonials, services and more...

1) Header Section - top

<header class="header-wrapper">
	<div class="topbar-wrapper">
		<div class="container">
			<div class="topbar-inner">
				<div class="topbar-left">
					Redias Digital & Creative Agency Receives Capital Investment.
				</div>
				<div class="topbar-right">
					<ul>
						<li><a href="mailto:dynamiclayers@gmail.com">dynamiclayers@gmail.com</a></li>
						<li><a href="#">Login</a></li>
						<li class="topbar-search">
							<form action="#">
								<input type="text" placeholder="Search" autocomplete="off">
								<button class="search-btn" type="button"><i class="fa fa-search"></i></button>
							</form>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div><!-- /.topbar-wrapper -->
	<div class="navigation-wrapper">
		<div class="container">
			<div class="navigation-inner">
				<div class="site-logo">
					<a href="index.html"><img src="assets/img/logo.png" alt="Redias"></a>
				</div>
				<nav class="navigation-menu">
					<ul class="main-menu-desktop">
						<li><a href="index.html">Home</a>
							<ul>
								<li><a href="index.html">Homepage Default</a></li>
							</ul>
						</li>
						<li><a href="about-us.html">Company</a>
							<ul>
								<li><a href="about-us.html">About Us</a></li>
							</ul>
						</li>
						<li><a href="projects.html">Projects</a>
							<ul>
								<li><a href="projects.html">Our Projects</a></li>
							</ul>
						</li>
						<li><a href="blog-grid.html">Blog</a>
							<ul>
								<li><a href="blog-grid.html">Blog Grid</a></li>
							</ul>
						</li>
						<li><a href="contact.html">Contact</a></li>
					</ul>
					<button class="sidebar-trigger"><svg fill="currentColor" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
							<path d="M1 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2zm5 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V2zm5 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1V2zM1 7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V7zm5 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V7zm5 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1V7zM1 12a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-2zm5 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1v-2zm5 0a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2z" />
						</svg></button>
				</nav>
				<div class="header-number">
					<i class="las la-comments"></i>
					<div>
						Let's Chat
						<a href="tel:881900678956">88 1900 6789 56</a>
					</div>
				</div>
			</div>
		</div>
	</div>
</header>
<!--/.main-header-->

2) Hero Section - top


<section class="hero-section">
	<div class="container">
		<div class="row align-items-center">
			<div class="col-md-7 sm-padding">
				<div class="hero-content">
					<h3><i class="las la-bolt"></i>Trusted Digital Agency!</h3>
					<h2>Smart Ideas For Your Brands Are Here!</h2>
					<p>Our success in creating business solutions is due in large part to <br>our talented and highly committed team.</p>
					<div class="btn-holder">
						<a href="#" class="default-btn">Discover More</a>
						<a class="play-btn dl-video-popup" data-vbtype="video" href="https://www.youtube.com/watch?v=ZLaG1migE00">
							<span class="play-icon"><svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
									<path fill="currentColor" d="M424.4 214.7L72.4 6.6C43.8-10.3 0 6.1 0 47.9V464c0 37.5 40.7 60.1 72.4 41.3l352-208c31.4-18.5 31.5-64.1 0-82.6z"></path>
								</svg></span>
							<span class="play-btn-txt">Watch Video</span>
						</a>
						<img class="hero-arrow" src="assets/img/arrow-img.png" alt="arrow">
					</div>
				</div>
			</div>
			<div class="col-md-5 d-none d-md-block">
				<div class="brands-circle">
					<div class="inner-icon">
						<i class="lab la-hubspot"></i>
					</div>
					<div class="center-icon"><i class="lab la-earlybirds"></i></div>
					<div class="outer-icon">
						<i class="lab la-behance"></i>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!--/.hero-section-->

3) Slider Section - top


<div class="slider-section bg-grey padding-bottom">
	<div class="map-pattern"></div>
	<div class="container">
		<div class="main-slider slider-controler">
			<div class="swiper-wrapper">
				<div class="swiper-slide">
					<div class="slider-img"><img src="assets/img/slider-1.jpg" alt="img" class="kenburns" style="animation-duration: 12000ms;"></div>
					<div class="slider-content-wrap">
						<div class="slider-content">
							<div class="slider-caption medium">
								<div class="inner-layer">
									<div data-animation="fade-in-bottom" data-delay="0.3s">Smart Business Solution!
									</div>
								</div>
							</div>
							<div class="slider-caption big">
								<div class="inner-layer">
									<div data-animation="fade-in-bottom" data-delay="0.5s">Modern Digital <br>Agency Solution!
									</div>
								</div>
							</div>
							<div class="slider-btn">
								<a href="book-taxi.html" class="default-btn" data-animation="fade-in-bottom" data-delay="0.9s">Get Free Consulting</a>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="swiper-pagination"></div>
		</div>
	</div>
</div>
<!--/.slider-section-->


4) About Section - top


<section class="about-section padding">
	<div class="container">
		<div class="section-heading text-center mb-40">
			<h4 class="sub-heading">About Our Company</h4>
			<h2>Unlock the potential of your business <br>with creative design</h2>
		</div>
		<div class="row">
			<div class="col-md-4 text-right">
				<div class="about-img img-1"><img src="assets/img/about-1.jpg" alt="img"></div>
			</div>
			<div class="col-md-5 d-flex align-items-center">
				<div class="about-content">
					<p>Redias a trusted name for providing assistants. Initially their main objective was to ensure the service they provide these people are loyal to their industry, experienced and main top professional. Financial experts support or help you to to find out which way you can raise your funds more.</p>
					<a href="about.html" class="read-more"><i class="las la-arrow-right"></i></a>
					<h4><span>A+ Ratting <b>Agency</b></span></h4>
				</div>
			</div>
			<div class="col-md-3">
				<div class="about-img img-2"><img src="assets/img/about-2.jpg" alt="img"></div>
			</div>
		</div>
	</div>
</section>
<!--/.about-section-->


5) Service Section - top


<section class="service-section bg-grey padding">
	<div class="corner-pattern"></div>
	<div class="corner-pattern bottom"></div>
	<div class="arrow-direction"></div>
	<div class="container">
		<div class="section-heading text-center mb-40">
			<h4 class="sub-heading white">Our Services</h4>
			<h2>Start your digital business <br>with redias!</h2>
		</div>
		<div class="row">
			<div class="col-lg-4 col-md-6 sm-padding">
				<div class="service-item">
					<div class="service-icon"><i class="dl dl-presentation"></i></div>
					<h3>Web Development</h3>
					<p>Redias a trusted name for providing assistants. Initially their main objective was to ensure service they provide these people are loyal .</p>
					<a href="service-details.html">Explore Services <i class="las la-long-arrow-alt-right"></i></a>
				</div>
			</div>
		</div>
		<div class="mt-40 text-center">
			<a href="services-details.html" class="default-btn">Explore all Services</a>
		</div>
	</div>
	<div class="bg-half-color">
		<div class="shape-pattern"></div>
	</div>
</section>
<!--/.services-section-->


6) Project Section - top


<section class="project-section bg-grey padding">
	<div class="container">
		<div class="section-heading-wrap mb-40">
			<div class="section-heading">
				<h4 class="sub-heading">Our Complete Crafts</h4>
				<h2>Market-leading digital <br>expertise at your fingertips!</h2>
			</div>
			<a href="project-details.html" class="default-btn">View All Projects</a>
		</div>
		<div class="project-carousel-wraper">
			<div class="project-carousel">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<div class="project-item">
							<div class="project-thumb">
								<a href="project-details.html"><img src="assets/img/project-1.jpg" alt="img"></a>
							</div>
							<div class="project-content">
								<h4><a href="project-details.html">Tech App</a></h4>
								<h3><a href="project-details.html">Branding the Digital Age</a></h3>
								<a href="project-details.html" class="read-more">Read More<i class="las la-long-arrow-alt-right"></i></a>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- Carousel Dots -->
			<div class="carousel-pagination"></div>
		</div>
	</div>
</section>
<!--/.project-section-->


7) Testimonial Section - top


<section class="testimonial-section padding">
	<div class="map-pattern"></div>
	<div class="container">
		<div class="section-heading text-center mb-40">
			<h4 class="sub-heading">Clients Testimonials</h4>
			<h2>What our customers tell about <br>our service!</h2>
		</div>
		<div class="row align-items-center">
			<div class="col-md-3 d-none d-md-block"><img src="assets/img/testimonial-left-image.png" alt="img"></div>
			<div class="col-md-6">
				<div class="testimonial-carousel-wrapper">
					<div class="testimonial-carousel">
						<div class="swiper-wrapper">
							<div class="swiper-slide">
								<div class="testi-item">
									<div class="quote-icon"><i class="las la-quote-right"></i></div>
									<p>Redias a trusted name for providing assistants. Initially their main objective was to ensure the service they provide these people are loyal to their industry, experienced and main top professional. Financial experts support </p>
									<div class="testi-author">
										<div class="author-thumb"><img src="assets/img/comment-1.png" alt="author">
										</div>
										<div class="author-info">
											<h3>Eredrik Johanson</h3>
											<h4>Financial .INC</h4>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="carousel-pagination"></div><!-- Carousel Dots -->
				</div>
			</div>
			<div class="col-md-3 d-none d-md-block"><img src="assets/img/testimonial-right-image.png" alt="img"></div>
		</div>
	</div>
</section>
<!--/.testimonial-section-->


8) Counter Section - top

<section class="counter-section bg-dark">
	<div class="map-pattern light"></div>
	<div class="shape-pattern"></div>
	<div class="shape-pattern"></div>
	<div class="container">
		<div class="row">
			<div class="col-lg-3 col-md-6 sm-padding">
				<div class="counter-item">
					<div class="counter-icon"><i class="dl dl-startup"></i></div>
					<div class="counter-content">
						<h3><span class="odometer" data-count="145">00</span>+</h3>
						<h4>Project Done</h4>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!--/.counter-section-->

9) Skill Section - top

<section class="skill-section">
	<div class="container">
		<div class="row skill-section-wrap">
			<div class="col-lg-4">
				<div class="skill-img"><img src="assets/img/skill-img.jpg" alt="img"></div>
			</div>
			<div class="col-lg-8">
				<div class="section-heading mb-40">
					<h4 class="sub-heading">Why Choose Us!</h4>
					<h2>We are a digital agency with <br>added value for your business!</h2>
				</div>
				<div class="skill-content-wrap">
					<div class="skill-item">
						<ul class="nav skill-tab-menu" id="skill-tab" role="tablist">
							<li class="nav-item" role="presentation">
								<button class="nav-link active" id="integrity" data-bs-toggle="tab" data-bs-target="#integrity-content" type="button" role="tab" aria-controls="integrity-content" aria-selected="true">Integrity</button>
							</li>
						</ul>
						<!--Tab Menu-->
						<div class="tab-content" id="skill-tab-content">
							<div class="tab-pane fade show active" id="integrity-content" role="tabpanel" aria-labelledby="integrity-content">
								<div class="skill-tab-content">
									<div class="tab-thumb"><img src="assets/img/tab-img-1.jpg" alt="img"></div>
									<ul class="tab-list">
										<li><i class="las la-hand-point-right"></i>Data Analytics</li>
										<li><i class="las la-hand-point-right"></i>Ico Management</li>
										<li><i class="las la-hand-point-right"></i>Site Program</li>
										<li><i class="las la-hand-point-right"></i>Visual Designing</li>
									</ul>
								</div>
								<div class="skill-progressbar">
									<div class="skillbar" data-percent="55%">
										<h4 class="skillbar-title">Digital Analysis</h4>
										<div class="skill-bar-percent">95%</div>
										<div class="skillbar-bar" style="width: 95%;"></div>
									</div>
								</div>
							</div>
						</div><!-- Tab Content -->
					</div>
					<!--/.skill-item-->
					<ul class="skill-item-list">
						<li>
							<h4>Creative Ideas</h4>
							<p>Redias a trusted name for providing assistants.</p>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</section>
<!--/.skill-section-->

10) Sponsor Section

<div class="sponsor-section padding">
	<div class="container">
		<div class="outside-spacing">
			<div class="sponsor-carousel">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<img src="assets/img/sponsor01.png" alt="client">
					</div>
				</div>
			</div>
		</div>
	</div>
</div><!-- /.sponsor-section -->

11) Short Promo Section

<section class="short-promo">
<div class="container">
	<div class="row">
		<div class="col-md-6 sm-padding">
			<div class="short-promo-item">
				<div class="promo-icon"><i class="dl dl-success"></i></div>
				<div class="promo-content">
					<h3>Professional Agency</h3>
					<p>Redias a trusted name for providing assistants. Initially their main objective was to ensure the service.</p>
				</div>
			</div>
		</div>
	</div>
</div>
</section>
<!--/.short-promo-->

12) CTA Section

<section class="cta-section">
	<div class="overlay"></div>
	<div class="container">
		<div class="cta-content section-heading text-center">
			<h4 class="sub-heading">Work With Us!</h4>
			<h2>Redias is a ready to protect <br>your business!</h2>
			<p>Redias a trusted name for providing assistants. Initially their main objective was <br> to ensure the service they provide these people</p>
			<div class="btn-group">
				<a href="#" class="default-btn">Get In Touch</a>
			</div>
		</div>
	</div>
</section>
<!--/.cta-section-->

13) Team Section

<section class="team-section padding">
	<div class="container">
		<div class="section-heading text-center mb-40">
			<h4 class="sub-heading">Our Team Members</h4>
			<h2>Meet Our Experienced <br>Professionals!</h2>
		</div>
		<div class="row">
			<div class="col-lg-3 col-md-6 sm-padding">
				<div class="team-item">
					<div class="team-item-inner">
						<img class="team-thumb" src="assets/img/team04.jpg" alt="img">
						<div class="team-content">
							<h3><a href="team-details.html">Brandon Larned</a></h3>
							<h4>Marketer</h4>
							<ul class="team-social">
								<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!--/.team-section-->

14) Blog Section

<section class="blog-section bg-grey padding">
	<div class="container">
		<div class="section-heading text-center mb-40">
			<h4 class="sub-heading">Latest Article</h4>
			<h2>Tips and Advice <br>From Blog</h2>
		</div>
		<div class="row grid-post">
			<div class="col-lg-4 col-md-6 padding-15">
				<div class="post-card">
					<div class="post-thumb">
						<img src="assets/img/post-1.jpg" alt="post">
					</div>
					<div class="post-content-wrap">
						<ul class="post-meta">
							<li><i class="las la-calendar"></i>Jan 01 2022</li>
							<li><i class="las la-tags"></i><a href="#">Design</a></li>
						</ul>
						<div class="post-content">
							<h3>
								<a href="blog-details.html" class="hover">Start initiating find an startup in days.</a>
							</h3>
							<p>Financial experts support or help you to to find out which way you can raise your
								funds more...</p>
							<a href="blog-details.html" class="read-more">Read More</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!--/.blog-section-->

15) Callback Section

<section class="call-back-section padding">
	<div class="map-pattern"></div>
	<div class="container">
		<div class="section-heading text-center mb-40">
			<h4 class="sub-heading">Get In Touch!</h4>
			<h2>Want to know why your website isn’t <br>getting the traffic it deserves?</h2>
		</div>
		<div class="row align-items-center">
			<div class="col-lg-6 col-md-4 d-none d-lg-block">
				<div class="callback-men"><img src="assets/img/callback-men.png" alt="img"></div>
			</div>
			<div class="col-lg-6 col-md-8 offset-lg-0 offset-md-2">
				<div class="callback-form ml-40">
					<h2>Request a Callback</h2>
					<form action="contact.php" method="post" id="ajax_contact" class="form-horizontal">
						<div class="callback-form-group">
							<div class="form-field">
								<input type="text" id="yourname" name="yourname" class="form-control" placeholder="Your Name" required="">
							</div>
							<div class="form-field message">
								<textarea id="message" name="message" cols="30" rows="4" class="form-control" placeholder="Message" required=""></textarea>
							</div>
							<div class="form-field">
								<button id="submit" class="default-btn" type="submit">Send Massage<span></span></button>
							</div>
						</div>
						<div id="form-messages" class="alert" role="alert"></div>
					</form>
				</div>
			</div>
		</div>
	</div>
</section>
<!--/.call-back-section-->

16) Feed Section

<section class="feed-section bg-grey padding">
	<div class="container">
		<ul class="brand-info">
			<li class="d-none d-lg-block">
				<h3>Info@Themeredias.com</h3>
			</li>
			<li><a class="footer-logo" href="index.html"><img src="assets/img/logo.png" alt="Logo"></a></li>
			<li>
				<form action="#" class="subscribe-form">
					<input class="form-control" type="email" name="email" placeholder="Your Email" required="">
					<input type="hidden" name="action" value="mailchimpsubscribe">
					<button class="submit">Subscribe</button>
					<div class="clearfix"></div>
				</form>
			</li>
		</ul>
		<div class="feed-carousel">
			<div class="swiper-wrapper">
				<div class="swiper-slide">
					<div class="feed-item">
						<img src="assets/img/project-1.jpg" alt="feed">
						<div class="feed-overlay">
							<a href="assets/img/project-1.jpg" class="dl-img-popup feed-icon"><i class="lab la-instagram"></i></a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!--/.feed-section-->

17) Footer Section

<footer class="footer-wrapper">
	<div class="map-pattern light"></div>
	<div class="shape-pattern"></div>
	<div class="container">
		<div class="row footer-widgets">
			<div class="col-lg-3 col-md-6 footer-widget sm-padding">
				<h3 class="widget-title">About Redias</h3>
				<p>We successfully cope with tasks of varying complexity and, provide longterm guarantees and regularly master new technologies.</p>
				<div class="social-links">
					<a href="#"><i class="fab fa-facebook-f"></i></a>
				</div>
			</div>
			<div class="col-lg-3 offset-lg-1 col-md-6 footer-widget sm-padding">
				<h3 class="widget-title">Company</h3>
				<ul>
					<li><a href="#">About Us</a></li>
				</ul>
			</div>
			<div class="col-lg-3 col-md-6 footer-widget sm-padding">
				<h3 class="widget-title">Contact</h3>
				<ul>
					<li>Flat 20, Reynolds Neck, North <br />Helenaville, FV77 8WS</li>
				</ul>
			</div>
			<div class="col-lg-2 col-md-6 footer-widget sm-padding">
				<h3 class="widget-title">Have a project in your mind?</h3>
				<a href="contact.html" class="contact-btn">Contact us</a>
			</div>
		</div><!-- /.footer-widgets -->
		<div class="footer-bottom">
			<div class="copyright-text">
				© <span id="currentYear"></span> Redias, All Rights Reserved. Design By <a href="https://themeforest/user/dynamiclayers/portfolio" target="_blank">DynamicLayers</a>
			</div>
			<ul>
				<li><a href="#">Privacy Policy</a></li>
			</ul>
		</div><!-- /.footer-bottom -->
	</div><!-- /.container -->
</footer><!-- /.footer-wrapper -->


14) Contact Form Configure

Just open the contact.php file and add your email in the 20 no line. That's it.

<?php

    // Only process POST reqeusts.
    if ($_SERVER["REQUEST_METHOD"] == "POST") {
        // Get the form fields and remove whitespace.
        $name = strip_tags(trim($_POST["name"]));
        $name = str_replace(array("\r","\n"),array(" "," "),$name);
        $email = filter_var(trim($_POST["email"]), FILTER_SANITIZE_EMAIL);
        $message = trim($_POST["message"]);

        // Check that data was sent to the mailer.
        if ( empty($name) OR empty($message) OR !filter_var($email, FILTER_VALIDATE_EMAIL)) {
            // Set a 400 (bad request) response code and exit.
            http_response_code(400);
            echo "Oops! There was a problem with your submission. Please complete the form and try again.";
            exit;
        }

        // Update this to your desired email address.
        $recipient = "contact@yourdomain.com";
        $subject = "Message from $name";

        // Email content.
        $email_content = "Name: $name\n";
        $email_content .= "Email: $email\n\n";
        $email_content .= "Subject: $subject\n\n";
        $email_content .= "Message: $message\n";

        // Email headers.
        $email_headers = "From: $name <$email>\r\nReply-to: <$email>";

        // Send the email.
        if (mail($recipient, $subject, $email_content, $email_headers)) {
            // Set a 200 (okay) response code.
            http_response_code(200);
            echo "Thank You! Your message has been sent.";
        } else {
            // Set a 500 (internal server error) response code.
            http_response_code(500);
            echo "Oops! Something went wrong and we couldn't send your message.";
        }

    } else {
        // Not a POST request, set a 403 (forbidden) response code.
        http_response_code(403);
        echo "There was a problem with your submission, please try again.";
    }

?>


 


C) CSS Files and Structure - top

These are the css files:

  1. bootstrap.min.css
  2. animate.min.css
  3. line-awesome-icons.css
  4. font-awesome-icons.css
  5. swiper-carousel.css
  6. main.css
  7. responsive.css

 


D) JavaScript - top

This theme use these Javascript files:

  1. jQuery
    jQuery is a Javascript library that greatly reduces the amount of code that you must write. jQuery use these javascript files:
                	bootstrap.min.js
                    popper.min.js
                    odometer.min.js
                    waypoints.min.js
                    venobox.min.js
                    swiper.min.js
                    smooth-scroll.js
                    wow.min.js
                    main.js
                
    You can edit the contact.js files. for setting contact form


F) Sources and Credits - top

  1. Bootstrap 4
  2. OWL Carousel
  3. WOW JS
  4. VenoBox
  5. Smooth Scroll
  6. AjaxChimp


G) PHP Code Explanation - top

There are only one php code for contact page which is contact.php, open this file and change the email and subject on line 24 and line 27. No need to edit other code unless you really want to.


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist.

DynamicLayers

Go To Table of Contents