htmldrupaldrupal-7drupal-themingdrupal-themes

After changing website template into drupal images don't load


I'm changing a site template into the drupal theme. I put the header in html.tpl.php and body in page.tpl.php and also set .info file but the page doesn't load properly and image of the site don't show in browser. it seems to me with these settings and Since I still haven't changed the static content. it should work same as static version if so what would be the problem?

HTML code:

    <html class="no-js" lang="en">
      <head>
        <meta charset="utf-8">
        <title>Home</title>
        <link rel="stylesheet" href="../css/style.css">
        <script type="text/javascript" src="../js/modernizr.js"></script>
      </head>
      <body>
       <div id="wrapper">       
        <div class="header-wrapper header-alt2">
                <div class="works-thumb">
                  <img src="../img/works/works-8.jpg" alt="Project Name">
                  <div class="works-title">                            
                   <h4>
                     <a href="single-project-image.html">Project Name</a>
                   </h4>                            
                  </div>
                  <a href="portfolio.html" title="Category Name" class="works-icon"><i        class="icon-play"></i></a>
                  <div class="overlay">
                    <h4></h4>
                    <p>Project Name Description</p>   
                    <div class="overlay-icons">
                      <a href="../img/works/works-full8.jpg" title="Preview" class="works-preview fancybox tooltips"><i class="icon-eye"></i></a>
                      <a href="project-image.html" title="Permalink" class="works-link tooltips"><i class="icon-link"></i></a>
                      <a href="portfolio.html" title="Category Name" class="works-cat tooltips"><i class="icon-play"></i></a>
                    </div>
                  </div>
                 </div>            
         </div>
       </div>
     </body>
    </html>

.info file: package, core and ..

      stylesheets[all][] = css/style.css
      scripts[] = js/modernizr.js

and region

html.tpl.php file:

      ?><!DOCTYPE html>
    <html class="no-js" lang="en">
        <head profile="<?php print $grddl_profile; ?>">
          <?php print $head; ?>
          <title><?php print $head_title; ?></title>
          <?php print $styles; ?>
          <?php print $scripts; ?>
        </head>
        <body class="<?php print $classes; ?>" <?php print $attributes;?>>
          <?php print $page_top; ?>
          <?php print $page; ?>
          <?php print $page_bottom; ?>
        </body>
        </html>

page.tpl.php file:

       <div id="wrapper">       
        <div class="header-wrapper header-alt2">
                <div class="works-thumb">
                  <img src="../img/works/works-8.jpg" alt="Project Name">
                  <div class="works-title">                            
                   <h4>
                     <a href="single-project-image.html">Project Name</a>
                   </h4>                            
                  </div>
                  <a href="portfolio.html" title="Category Name" class="works-icon"><i        class="icon-play"></i></a>
                  <div class="overlay">
                    <h4></h4>
                    <p>Project Name Description</p>   
                    <div class="overlay-icons">
                      <a href="../img/works/works-full8.jpg" title="Preview" class="works-preview fancybox tooltips"><i class="icon-eye"></i></a>
                      <a href="project-image.html" title="Permalink" class="works-link tooltips"><i class="icon-link"></i></a>
                      <a href="portfolio.html" title="Category Name" class="works-cat tooltips"><i class="icon-play"></i></a>
                    </div>
                  </div>
                 </div>            
         </div>
       </div>

Solution

  • Copy your all images in to

    /sites/all/themes/yourthemename/images

    folder.

    Then change the image path in page.tpl.php like this:

    /sites/all/themes/yourthemename/works-8.jpg

    instead of using:

    ../img/works/works-8.jpg