Jump to content

How add custom CSS to a custom theme

Capwell

By Capwell
in Developer Corner

 Share

Recommended Posts

Capwell Junior Member

Capwell

Posted
Posted

Hi,

 

How do I correctly link the CSS files.

 

Header.tpl

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="{$charset}" />
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>{if $kbarticle.title}{$kbarticle.title} - {/if}{$pagetitle} - {$companyname}</title>
   <link href="/templates/cshost/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
   <link href="/templates/cshost/css/idangerous.swiper.css" rel="stylesheet" />
   <link href="/templates/cshost/css/style.css" rel="stylesheet" />
   <link href="/templates/cshost/css/animate.css" rel="stylesheet" />
   <link rel="shortcut icon" href="templates/cshost/img/favicon.ico" />
   {include file="$template/includes/head.tpl"}

   {$headoutput}

</head>
{$headeroutput}

   <!-- HEADER -->
   <header>
       <div class="container">
           <div id="logo-wrapper">
               <div class="cell-view"><a id="logo" href="index.html"><img src="templates/cshost/img/logo.png" alt="logo" /></a></div>
           </div>
           <div class="open-icon">
               <span></span>
               <span></span>
               <span></span>
           </div>
           <div class="header-container">
               <div class="scrollable-container">
                   <div class="header-left">
                       <nav>
                           <div class="menu-entry active">
                               <a href="index.html">Home</a>
                           </div>
                           <div class="menu-entry">
                               <a href="hosting.html">Hosting</a>
                               <span class="submenu-icon"><span class="glyphicon glyphicon-chevron-down"></span></span>
                               <div class="submenu">
                                   <div>
                                       <a href="hosting.html">Web Hosting</a>
                                       <a href="host-shared.html">Shared Servers [Coming Soon]</a>
                                       <a href="host-vps.html">VPS</a>
                                       <a href="host-dedicated.html">Dedicated Servers [Coming Soon]</a>
                                   </div>
                               </div>
                           </div>
                           <div class="menu-entry">
                               <a href="host-domains.html">Domains</a>
                           </div>
                           <div class="menu-entry">
                               <a href="#">Pages</a>
                               <span class="submenu-icon"><span class="glyphicon glyphicon-chevron-down"></span></span>
                               <div class="submenu">
                                   <div>
                                       <a href="host-about.html">About</a>
                                       <a href="host-faq.html">FAQ</a>
                                       <a href="host-testimonials.html">Testimonials</a>
                                       <a href="host-support.html">Support</a>
                                       <a href="login-register.html">Login/Register</a>
                                   </div>
                               </div>
                           </div>
                           <div class="menu-entry">
                               <a href="contact.html">Contact us</a>
                           </div>

                       </nav>
                   </div>
                   <div class="header-right">
                       <div class="header-inline-entry">
                           <a class="button" href="mailto:sales@capwell.co.uk">Sales</a>
                       </div>
                       <div class="header-inline-entry">
                           <a class="button" href="mailto:support@capwell.co.uk">Support</a>
                       </div>
                       <div class="header-inline-entry">
                           <a class="button" href="http://capwell.co.uk/whmcs">WHMCS</a>
                       </div>
                       <div class="header-inline-entry">
                           <a class="button" href="http://capwell.co.uk/cpanel">CPanel</a>
                       </div>
                       <div class="header-inline-entry">
                           <a class="button" href="http://capwell.co.uk/webmail">WebMail</a>
                       </div>
                   </div>
               </div>
           </div>
       </div>
   </header>

   <div class="subheader">
       <div class="container-fluid">
           <a id="subheader-logo" href="index.html"><img src="templates/cshost/img/logo.png" alt="logo" /></a>
           <div class="subheader-content">
               <div class="subheader-left">
                   <a class="scroll-to-link subheader-link" data-rel="1">Our Services</a>
                   <a class="scroll-to-link subheader-link" data-rel="2">Our Hostings</a>
                   <a class="scroll-to-link subheader-link" data-rel="3">Why Choose Us</a>
                   <a class="scroll-to-link subheader-link" data-rel="4">Which Plan Is Better</a>
                   <a class="scroll-to-link subheader-link" data-rel="5">Guarantee</a>
               </div>
               <div class="subheader-right">
                   <a class="button" href="http://capwell.co.uk/webmail">WebMail</a> 
                           
                           
                           
                           
                           
                           
                           
                           
                           
                           
                           
                           
                     
               </div>
               <div class="subheader-right">
                   <a class="button" href="http://capwell.co.uk/cpanel">CPanel</a> 
               </div>
               <div class="subheader-right">
                   <a class="button" href="http://capwell.co.uk/whmcs">WHMCS</a> 
               </div>
               <div class="subheader-right">
                   <a class="button" href="mailto:support@capwell.co.uk">Support</a> 
               </div>
               <div class="subheader-right">
                   <a class="button" href="mailto:sales@capwell.co.uk">Sales</a> 
               </div>
           </div>
       </div>
   </div>

{if $templatefile == 'homepage'}
   <section id="home-banner">
       <div class="container text-center">
           {if $registerdomainenabled || $transferdomainenabled}
               <h2>{$LANG.homebegin}</h2>
               <form method="post" action="domainchecker.php">
                   <div class="row">
                       <div class="col-md-8 col-md-offset-2 col-sm-10 col-sm-offset-1">
                           <div class="input-group input-group-lg">
                               <input type="text" class="form-control" name="domain" placeholder="{$LANG.exampledomain}" />
                               <span class="input-group-btn">
                                   {if $registerdomainenabled}
                                       <input type="submit" class="btn btn-warning" value="{$LANG.search}" />
                                   {/if}
                                   {if $transferdomainenabled}
                                       <input type="submit" name="transfer" class="btn btn-info" value="{$LANG.domainstransfer}" />
                                   {/if}
                               </span>
                           </div>
                       </div>
                   </div>

                   {include file="$template/includes/captcha.tpl"}
               </form>
           {else}
               <h2>{$LANG.doToday}</h2>
           {/if}
       </div>
   </section>
   <div class="home-shortcuts">
       <div class="container">
           <div class="row">
               <div class="col-md-4 hidden-sm hidden-xs text-center">
                   <p class="lead">
                       {$LANG.howcanwehelp}
                   </p>
               </div>
               <div class="col-sm-12 col-md-8">
                   <ul>
                       {if $registerdomainenabled || $transferdomainenabled}
                           <li>
                               <a id="btnBuyADomain" href="domainchecker.php">
                                   <i class="fa fa-globe"></i>
                                   <p>
                                       {$LANG.buyadomain} <span>»</span>
                                   </p>
                               </a>
                           </li>
                       {/if}
                       <li>
                           <a id="btnOrderHosting" href="cart.php">
                               <i class="fa fa-hdd-o"></i>
                               <p>
                                   {$LANG.orderhosting} <span>»</span>
                               </p>
                           </a>
                       </li>
                       <li>
                           <a id="btnMakePayment" href="clientarea.php">
                               <i class="fa fa-credit-card"></i>
                               <p>
                                   {$LANG.makepayment} <span>»</span>
                               </p>
                           </a>
                       </li>
                       <li>
                           <a id="btnGetSupport" href="submitticket.php">
                               <i class="fa fa-envelope-o"></i>
                               <p>
                                   {$LANG.getsupport} <span>»</span>
                               </p>
                           </a>
                       </li>
                   </ul>
               </div>
           </div>
       </div>
   </div>
{/if}

<section id="main-body" class="container">

   <div class="row">
       {if !$inShoppingCart && ($primarySidebar->hasChildren() || $secondarySidebar->hasChildren())}
           {if $primarySidebar->hasChildren()}
               <div class="col-md-9 pull-md-right">
                   {include file="$template/includes/pageheader.tpl" title=$displayTitle desc=$tagline showbreadcrumb=true}
               </div>
           {/if}
           <div class="col-md-3 pull-md-left sidebar">
               {include file="$template/includes/sidebar.tpl" sidebar=$primarySidebar}
           </div>
       {/if}
       <!-- Container for main page display content -->
       <div class="{if !$inShoppingCart && ($primarySidebar->hasChildren() || $secondarySidebar->hasChildren())}col-md-9 pull-md-right{else}col-xs-12{/if} main-content">
           {if !$primarySidebar->hasChildren() && !$showingLoginPage && !$inShoppingCart && $templatefile != 'homepage'}
               {include file="$template/includes/pageheader.tpl" title=$displayTitle desc=$tagline showbreadcrumb=true}
           {/if}

 

Footer.tpl


</div>
</div>

   <!-- FOOTER -->
   <footer>
       <div class="container">
           <div class="row">
               <div class="footer-entry col-md-3">
                   <h3 class="title"> Capwell Studios</h3>
                   <div class="text">Duis posuere blandit orci sed tincidunt. Curabitur porttitor nisi ac nunc ornare, in fringilla nisl blandit. Duis posuere blandit orci sed tincidunt. Curabitur porttitor nisi ac nunc ornare, in fringilla nisl blandit. Praesent nisl sapien, semper quis convallis et, tempus vitae dolor.</div>
               </div>
               <div class="footer-entry col-md-2 col-sm-3 col-xs-6">
                   <h3 class="title"> Capwell Studios | Hosting</h3>
                   <ul>
                       <li><a href="hosting.html">Web Hosting</a></li>
                       <li><a href="host-resell.html">Reseller Hosting</a></li>
                       <li><a href="host-vps.html">VPS Hosting</a></li>
                       <li><a href="hosting.html">Shared Hosting [Coming Soon]</a></li>
                       <li><a href="host-dedicated.html">Dedicated Hosting [Coming Soon]</a></li>
                   </ul>
               </div>
               <div class="footer-entry col-md-2 col-sm-3 col-xs-6">
                   <h3 class="title">Company</h3>
                   <ul>
                       <li><a href="host-about.html">About Capwell Studios</a></li>
                       <li><a href="host-testimonials.html">Awards & Reviews</a></li>
                       <li><a href="host-about.html">Press & Media</a></li>
                       <li><a href="contact.html">Contact Us</a></li>
                       <li><a href="job.html">Careers</a></li>
                   </ul>
               </div>
               <div class="clearfix visible-xs"></div>
               <div class="footer-entry col-md-5 col-sm-6 col-xs-12">
                   <h3 class="title">Newsletter Subscribe</h3>
                   <div class="text">Subscribe to our Newsletter for OFFERS and TIPS, these will be disclosed once you sign up, if you don't get the email straight away, please contact admin@capwell.co.uk <em>All Emails will come from jack@capwell.co.uk</em>.</div>
                   <div class="subscription-form">
                       <form>
                           <input type="email" required value="" placeholder="Your Email..."/>
                           <input type="submit" value="" />
                       </form>
                   </div>
               </div>
           </div>
           <div class="row nopadding social-icons-wrapper">
               <div class="col-xs-3 nopadding">
                   <a class="social-icon" href="https://www.facebook.com/" target="_blank" style="background-color: #3b5998;">
                       <img src="/templates/cshost/img/icon-17.png" alt="" />
                   </a>
               </div>
               <div class="col-xs-3 nopadding">
                   <a class="social-icon" href="https://plus.google.com" target="_blank" style="background-color: #e02f2f;">
                       <img src="/templates/cshost/img/icon-18.png" alt="" />
                   </a>
               </div>
               <div class="col-xs-3 nopadding">
                   <a class="social-icon" href="https://twitter.com/" target="_blank" style="background-color: #55acee;">
                       <img src="/templates/cshost/img/icon-19.png" alt="" />
                   </a>
               </div>
               <div class="col-xs-3 nopadding">
                   <a class="social-icon" href="https://www.linkedin.com/" target="_blank" style="background-color: #007bb5;">
                       <img src="/templates/cshost/img/icon-20.png" alt="" />
                   </a>
               </div>
           </div>
           <div class="row">
               <div class="col-md-8">
                   <ul class="footer-menu">
                       <li><a class="active" href="index.html">Home</a></li>
                       <li><a href="hosting.html">Hosting</a></li>
                       <li><a href="host-domains.html">Domains</a></li>
                       <li><a href="sitemap.html">Sitemap</a></li>
                       <li><a href="contact.html">Contact Us</a></li>                                       
                   </ul>
               </div>
               <div class="col-md-4">
                   <div class="copyright">© 2016 All rights reserved. Capwell Studios | Hosting</div>
               </div>
           </div>
       </div>
       <div class="footer-line">
           <div class="container">
               <div class="row">
                   <div class="footer-line-entry col-md-3 col-sm-6 col-xs-12">
                       <img src="/templates/cshost/img/icon-22.png" alt=""/>
                       <div class="content">
                           <div class="cell-view">24/7 Customer Support</div>
                       </div>
                   </div>
                   <div class="footer-line-entry col-md-3 col-sm-6 col-xs-12">
                       <img src="/templates/cshost/img/icon-23.png" alt=""/>
                       <div class="content">
                           <div class="cell-view"><a href="http://capwell.co.uk/whmcs/submitticket.php">Send A Ticket</a></div>
                       </div>
                   </div>
                   <div class="footer-line-entry col-md-3 col-sm-6 col-xs-12">
                       <img src="/templates/cshost/img/icon-24.png" alt=""/>
                       <div class="content">
                           <div class="cell-view"><a href="tel:+44 740 3166 858">+44 740 3166 858</a></div>
                       </div>
                   </div>
                   <div class="footer-line-entry col-md-3 col-sm-6 col-xs-12">
                       <img src="/templates/cshost/img/icon-25.png" alt=""/>
                       <div class="content">
                           <div class="cell-view"><a href="#">Live Chat [Coming Soon]</a></div>
                       </div>
                   </div>
               </div>
           </div>
       </div>
   </footer>

   <script src="js/jquery-2.1.3.min.js"></script>
   <script src="js/bootstrap.min.js"></script>
   <script src="js/idangerous.swiper.min.js"></script>
   <script src="js/global.js"></script>
   <script src="js/wow.min.js"></script>
   <script src="js/wow.init.js"></script>


{$footeroutput}

</body>
</html>

 

Any info would be greatly thanked!

0
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...

Important Information

By using this site, you agree to our Terms of Use & Guidelines and understand your posts will initially be pre-moderated

  I accept