Problems with the look of pages

**kalastaja** · 16 Dec 2019, 01:01 PM

Why does the pages show in txt-"mode" not html? Links as broken picture and blue.

**Design75** · 16 Dec 2019, 01:34 PM

Originally Posted by kalastaja

Why does the pages show in txt-"mode" not html? Links as broken picture and blue.

Really, that's all the info you give us?? You should know better

**kalastaja** · 16 Dec 2019, 07:57 PM

You're right, I should know better

; So let me rethink and elaborate:

Started finally to install ZenCart 1.5.6 and it went sort of ok - the admin section works well, graphics etc.
However the shop did not start working properly - the text, links and stuff are there, but no "graphics".
I did tweak the config's - admin is working, so something must be right!?
The off-line environment I'm using is Xampp.
Installing on a real site is not a problem, however I would like to have some proof-of-concept.

**mc12345678** · 16 Dec 2019, 09:58 PM

The general issue is that css is not being accessed. This can be for a number of reasons:
The css files are not present.
The browser has cached some sort of access for "this" address and needs to be cleared or to be force reloaded (I think it is ctrl-F5 or perhaps shift-F5).
There is a mix of https/http such that the css files are not loaded.
There is a path configuration issue (includes/configure.php file is not correct or perhaps the includes/defined_paths.php is not correct or improperly overridden)
There is a problem with the permissions/ownership with the css folder.

With it installed locally, can provide the includes/configure.php and admin/includes/configure.php files obscuring the DB_ related username, database, and password data to remain private.
Can compare folder permissions and ownership of the css folder with another such as common or templates within the folder.
Can share the source code from the page at/around the point where the css files are referenced and a few lines elsewhere that contain reference to template type links.
There are probably other pieces of information that may be shared as well.

**kalastaja** · 9 Jan 2020, 01:36 PM

The system is running on a Windows-system (file permissions...),
and as I said the admin-side is running smoothly.
I've set the http and https addresses to the same.
Seems to be using responsive template and
the loaded main page looks like follows:

Code:

<!DOCTYPE html>
<html dir="ltr" lang="en">
  <head>
  <meta charset="utf-8">
  <title>Zen Cart!, The Art of E-commerce</title>
  <meta name="keywords" content="ecommerce, open source, shop, online shopping, store " />
  <meta name="description" content="Zen Cart! :  - ecommerce, open source, shop, online shopping, store" />
  <meta name="author" content="Venla" />
  <meta name="generator" content="shopping cart program by Zen Cart&reg;, http://www.zen-cart.com eCommerce" />

  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes"/>


  <base href="http://localhost/venla/index.php/" />
  <link rel="canonical" href="http://localhost/venla/index.php/" />

<link rel="stylesheet" type="text/css" href="includes/templates/responsive_classic/css/stylesheet.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/responsive_classic/css/stylesheet_colors.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/responsive_classic/css/stylesheet_css_buttons.css" />
<link rel="stylesheet" type="text/css" media="print" href="includes/templates/responsive_classic/css/print_stylesheet.css" />

<script type="text/javascript">window.jQuery || document.write(unescape('%3Cscript type="text/javascript" src="https://code.jquery.com/jquery-3.4.0.min.js" integrity="sha256-BJeo0qm959uMBGb65z40ejJYGSgR7REI4+CW1fNKwOg=" crossorigin="anonymous"%3E%3C/script%3E'));</script>
<script type="text/javascript">window.jQuery || document.write(unescape('%3Cscript type="text/javascript" src="includes/templates/template_default/jscript/jquery.min.js"%3E%3C/script%3E'));</script>

<script type="text/javascript" src="includes/templates/responsive_classic/jscript/jscript_matchHeight-min.js"></script>
<script type="text/javascript"><!--//<![CDATA[
if (typeof zcJS == "undefined" || !zcJS) {
  window.zcJS = { name: 'zcJS', version: '0.1.0.0' };
};
zcJS.ajax = function (options) {
  options.url = options.url.replace("&amp;", unescape("&amp;"));
  var deferred = jQuery.Deferred(function (d) {
      var securityToken = '18753c460827c10d6d90100652e668ee';
      var defaults = {
          cache: false,
          type: 'POST',
          traditional: true,
          dataType: 'json',
          timeout: 5000,
          data: jQuery.extend(true,{
            securityToken: securityToken
        }, options.data)
      },
      settings = jQuery.extend(true, {}, defaults, options);
      if (typeof(console.log) == 'function') {
          console.log( settings );
      }

      d.done(settings.success);
      d.fail(settings.error);
      d.done(settings.complete);
      var jqXHRSettings = jQuery.extend(true, {}, settings, {
          success: function (response, textStatus, jqXHR) {
            d.resolve(response, textStatus, jqXHR);
          },
          error: function (jqXHR, textStatus, errorThrown) {
              if (window.console) {
                if (typeof(console.log) == 'function') {
                  console.log(jqXHR);
                }
              }
              d.reject(jqXHR, textStatus, errorThrown);
          },
          complete: d.resolve
      });
      jQuery.ajax(jqXHRSettings);
   }).fail(function(jqXHR, textStatus, errorThrown) {
   var response = jqXHR.getResponseHeader('status');
   var responseHtml = jqXHR.responseText;
   var contentType = jqXHR.getResponseHeader("content-type");
   switch (response)
     {
       case '403 Forbidden':
         var jsonResponse = JSON.parse(jqXHR.responseText);
         var errorType = jsonResponse.errorType;
         switch (errorType)
         {
           case 'ADMIN_BLOCK_WARNING':
           break;
           case 'AUTH_ERROR':
           break;
           case 'SECURITY_TOKEN':
           break;

           default:
             alert('An Internal Error of type '+errorType+' was received while processing an ajax call. The action you requested could not be completed.');
         }
       break;
       default:
        if (jqXHR.status === 200) {
            if (contentType.toLowerCase().indexOf("text/html") >= 0) {
                document.open();
                document.write(responseHtml);
                document.close();
            }
         }
     }
   });

  var promise = deferred.promise();
  return promise;
};
zcJS.timer = function (options) {
  var defaults = {
    interval: 10000,
    startEvent: null,
    intervalEvent: null,
    stopEvent: null

},
  settings = jQuery.extend(true, {}, defaults, options);

  var enabled = new Boolean(false);
  var timerId = 0;
  var mySelf;
  this.Start = function()
  {
      this.enabled = new Boolean(true);

      mySelf = this;
      mySelf.settings = settings;
      if (mySelf.enabled)
      {
          mySelf.timerId = setInterval(
          function()
          {
              if (mySelf.settings.intervalEvent)
              {
                mySelf.settings.intervalEvent(mySelf);
              }
          }, mySelf.settings.interval);
          if (mySelf.settings.startEvent)
          {
            mySelf.settings.startEvent(mySelf);
          }
      }
  };
  this.Stop = function()
  {
    mySelf.enabled = new Boolean(false);
    clearInterval(mySelf.timerId);
    if (mySelf.settings.stopEvent)
    {
      mySelf.settings.stopEvent(mySelf);
    }
  };
};

//]] --></script>


<script type="text/javascript"><!--//

(function($) {
$(document).ready(function() {

$('#contentMainWrapper').addClass('onerow-fluid');
 $('#mainWrapper').css({
     'max-width': '100%',
     'margin': 'auto'
 });
 $('#headerWrapper').css({
     'max-width': '100%',
     'margin': 'auto'
 });
 $('#navSuppWrapper').css({
     'max-width': '100%',
     'margin': 'auto'
 });


$('.leftBoxContainer').css('width', '');
$('.rightBoxContainer').css('width', '');
$('#mainWrapper').css('margin', 'auto');

$('a[href="#top"]').click(function(){
$('html, body').animate({scrollTop:0}, 'slow');
return false;
});

$(".categoryListBoxContents").click(function() {
window.location = $(this).find("a").attr("href"); 
return false;
});

$('.centeredContent').matchHeight();
$('.specialsListBoxContents').matchHeight();
$('.centerBoxContentsAlsoPurch').matchHeight();
$('.categoryListBoxContents').matchHeight();

$('.no-fouc').removeClass('no-fouc');
});

}) (jQuery);

//--></script>


<link rel="stylesheet" type="text/css" href="includes/templates/responsive_classic/css/responsive.css" /><link rel="stylesheet" type="text/css" href="includes/templates/responsive_classic/css/responsive_default.css" />  <script type="text/javascript">document.documentElement.className = 'no-fouc';</script>
  <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
</head>


<body id="indexHomeBody">



<div id="mainWrapper">



<!--bof-header logo and navigation display-->

<div id="headerWrapper">

<!--bof navigation display-->
<div id="navMainWrapper" class="group onerow-fluid">

<div id="navMain">
  <ul class="back">
    <li><a href="http://localhost/venla/index.php/">Home</a></li>
    <li class="last"><a href="http://localhost/venla/index.php/index.php?main_page=login">Log In</a></li>

  </ul>
<div id="navMainSearch" class="forward"><form name="quick_find_header" action="http://localhost/venla/index.php/index.php?main_page=advanced_search_result" method="get"><input type="hidden" name="main_page" value="advanced_search_result" /><input type="hidden" name="search_in_description" value="1" /><input type="text" name="keyword" size="6" maxlength="30" style="width: 100px" placeholder="Enter search keywords here"  />&nbsp;<input class="cssButton submit_button button  button_search" onmouseover="this.className='cssButtonHover  button_search button_searchHover'" onmouseout="this.className='cssButton submit_button button  button_search'" type="submit" value="Search" /></form></div>
</div>
</div>
<!--eof navigation display-->


<!--bof branding display-->
<div id="logoWrapper" class="group onerow-fluid">
    <div id="logo"><a href="http://localhost/venla/index.php/"><img src="includes/templates/responsive_classic/images/logo.gif" alt="Powered by Zen Cart :: The Art of E-Commerce" title=" Powered by Zen Cart :: The Art of E-Commerce " width="192px" height="64px" /></a>    <div id="taglineWrapper">
      <div id="tagline">TagLine Here</div>
  </div>
  </div>
</div>

<!--eof branding display-->
<!--eof header logo and navigation display-->


<!--bof optional categories tabs navigation display-->
<!--eof optional categories tabs navigation display-->

<!--bof header ezpage links-->
<!--eof header ezpage links-->
</div>


<div id="contentMainWrapper">

  <div class="col150">
<!--// bof: categories //-->
<div class="leftBoxContainer" id="categories" style="width: 150">
<h3 class="leftBoxHeading" id="categoriesHeading">Categories</h3>
<div id="categoriesContent" class="sideBoxContent"><ul class="list-links">

<li><a class="category-links" href="http://localhost/venla/index.php/index.php?main_page=products_all">All Products ...</a></li>
</ul></div></div>
<!--// eof: categories //-->

<!--// bof: reviews //-->
<div class="leftBoxContainer" id="reviews" style="width: 150">
<h3 class="leftBoxHeading" id="reviewsHeading"><a href="http://localhost/venla/index.php/index.php?main_page=reviews">Reviews&nbsp;&nbsp;[more]</a></h3>
<div id="reviewsContent" class="sideBoxContent centeredContent">There are currently no product reviews.</div></div>
<!--// eof: reviews //-->

<!--// bof: information //-->
<div class="leftBoxContainer" id="information" style="width: 150">
<h3 class="leftBoxHeading" id="informationHeading">Information</h3>
<div id="informationContent" class="sideBoxContent">
<ul class="list-links">
<li><a href="http://localhost/venla/index.php/index.php?main_page=shippinginfo">Shipping &amp; Returns</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=privacy">Privacy Notice</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=conditions">Conditions of Use</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=contact_us">Contact Us</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=site_map">Site Map</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=gv_faq">Gift Certificate FAQ</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=discount_coupon">Discount Coupons</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=unsubscribe">Newsletter Unsubscribe</a></li>
</ul>
</div></div>
<!--// eof: information //-->

<!--// bof: moreinformation //-->
<div class="leftBoxContainer" id="moreinformation" style="width: 150">
<h3 class="leftBoxHeading" id="moreinformationHeading">More Information</h3>
<div id="moreinformationContent" class="sideBoxContent">

<ul class="list-links">
<li><a href="http://localhost/venla/index.php/index.php?main_page=page_2">Page 2</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=page_3">Page 3</a></li>
<li><a href="http://localhost/venla/index.php/index.php?main_page=page_4">Page 4</a></li>
</ul>
</div></div>
<!--// eof: moreinformation //-->

<!--// bof: bannerbox //-->
<div class="leftBoxContainer" id="bannerbox" style="width: 150">
<h3 class="leftBoxHeading" id="bannerboxHeading">Sponsors</h3>
<div id="bannerboxContent" class="sideBoxContent centeredContent"><a href="http://localhost/venla/index.php/index.php?main_page=redirect&amp;action=banner&amp;goto=2" target="_blank"><img src="images/banners/125zen_logo.gif" alt="Zen Cart the art of e-commerce" title=" Zen Cart the art of e-commerce " width="125" height="38" /></a></div></div>
<!--// eof: bannerbox //-->

  </div>


  <div class="col670">

<!-- bof  breadcrumb -->
    <div id="navBreadCrumb">Home
</div>
<!-- eof breadcrumb -->


<!-- bof upload alerts -->
<!-- eof upload alerts -->

<div class="centerColumn" id="indexDefault">
<h1 id="indexDefaultHeading">Congratulations! You have successfully installed your Zen Cart&reg; E-Commerce Solution.</h1>

<h2 class="greeting">Welcome <span class="greetUser">Guest!</span> Would you like to <a href="http://localhost/venla/index.php/index.php?main_page=login">log yourself in</a>?</h2>

<!-- deprecated - to use uncomment this section
<div id="" class="content">This is the main define statement for the page for english when no template defined file exists. It is located in: <strong>/includes/languages/english/index.php</strong></div>
-->

<!-- deprecated - to use uncomment this section
<div id="" class="content">Define your main Index page copy here.</div>
-->

<div id="indexDefaultMainContent" class="content">
<a href="http://www.zen-cart.com/book"><img src="includes/templates/responsive_classic/images/zencart-book.png" alt="get your manual today" title="Have you got yours yet? Join the 1000's of Zen Cart users that have bought the only comprehensive owners manual !" class="home-image" /></a>

<p class="biggerText">The template package uses PHP Mobile Detect to serve up the optimized layout based on device.  
    If you are on a Desktop and want to view the Tablet layout <a class="red" href="index.php?main_page=index&amp;layoutType=tablet">use this link.</a>  
    If you want to view the Mobile layout <a class="red" href="index.php?main_page=index&amp;layoutType=mobile">use this link.</a>  
    To switch back to a Desktop <a class="red" href="index.php?main_page=index&amp;layoutType=default">use this link.</a></p>
    
<p>This content is located in the file at: <code> /languages/english/html_includes/YOUR_TEMPLATE/define_main_page.php</code></p>
<p>You can quickly edit this content via Admin->Tools->Define Pages Editor, and select define_main_page from the pulldown.</p>
<p><strong>NOTE: Always backup the files in<code> /languages/english/html_includes/your_template</code></strong></p>
</div>

<!-- bof: whats_new -->
<!-- eof: whats_new -->

<!-- bof: featured products  -->
<!-- eof: featured products  -->

<!-- bof: specials -->
<!-- eof: specials -->

</div>
  </div>

  <div class="col150">
<!--// bof: bannerboxall //-->
<div class="rightBoxContainer" id="bannerboxall" style="width: 150">
<h3 class="rightBoxHeading" id="bannerboxallHeading">Sponsors</h3>
<div id="bannerboxallContent" class="sideBoxContent centeredContent"><a href="http://localhost/venla/index.php/index.php?main_page=redirect&amp;action=banner&amp;goto=5" target="_blank"><img src="images/banners/bw_zen_88wide.gif" alt="Zen Cart the art of e-commerce" title=" Zen Cart the art of e-commerce " width="88" height="27" /></a></div></div>
<!--// eof: bannerboxall //-->

<!--// bof: search //-->
<div class="rightBoxContainer" id="search" style="width: 150">
<h3 class="rightBoxHeading" id="searchHeading"><label>Search</label></h3>
<div id="searchContent" class="sideBoxContent centeredContent"><form name="quick_find" action="http://localhost/venla/index.php/index.php?main_page=advanced_search_result" method="get"><input type="hidden" name="main_page" value="advanced_search_result" /><input type="hidden" name="search_in_description" value="1" /><input type="text" name="keyword" size="18" maxlength="100" style="width: 120px" placeholder="search here"  /><br /><input class="cssButton submit_button button  button_search" onmouseover="this.className='cssButtonHover  button_search button_searchHover'" onmouseout="this.className='cssButton submit_button button  button_search'" type="submit" value="Search" /><br /><a href="http://localhost/venla/index.php/index.php?main_page=advanced_search">Advanced Search</a></form></div></div>
<!--// eof: search //-->

<!--// bof: bannerbox2 //-->
<div class="rightBoxContainer" id="bannerbox2" style="width: 150">
<h3 class="rightBoxHeading" id="bannerbox2Heading">Have you seen ...</h3>
<div id="bannerbox2Content" class="sideBoxContent centeredContent"><a href="http://localhost/venla/index.php/index.php?main_page=redirect&amp;action=banner&amp;goto=2" target="_blank"><img src="images/banners/125zen_logo.gif" alt="Zen Cart the art of e-commerce" title=" Zen Cart the art of e-commerce " width="125" height="38" /></a></div></div>
<!--// eof: bannerbox2 //-->

<!--// bof: whosonline //-->
<div class="rightBoxContainer" id="whosonline" style="width: 150">
<h3 class="rightBoxHeading" id="whosonlineHeading">Who's Online</h3>
<div id="whosonlineContent" class="sideBoxContent centeredContent">There currently is&nbsp;1&nbsp;guest&nbsp;online.</div></div>
<!--// eof: whosonline //-->

  </div>


</div>



<!--bof-navigation display -->
<div id="navSuppWrapper">
<div id="navSupp">
<ul>
<li><a href="http://localhost/venla/index.php/">Home</a></li>
</ul>
</div>
</div>
<!--eof-navigation display -->

<!--bof-ip address display -->
<div id="siteinfoIP">Your IP Address is:   ::1</div>
<!--eof-ip address display -->

<!--bof-banner #5 display -->
<!--eof-banner #5 display -->

<!--bof- site copyright display -->
<div id="siteinfoLegal" class="legalCopyright">Copyright &copy; 2020 <a href="http://localhost/venla/index.php/index.php?main_page=index" target="_blank">Venla-Tuote Oy</a>. Powered by <a href="http://www.zen-cart.com" target="_blank">Zen Cart</a></div>
<!--eof- site copyright display -->



</div>
<!--bof- parse time display -->
<!--eof- parse time display -->
<!--bof- banner #6 display -->
<div id="bannerSix" class="banners"><script><!--//<![CDATA[
   var loc = '//pan.zen-cart.com/display/group/1/';
   var rd = Math.floor(Math.random()*99999999999);
   document.write ("<scr"+"ipt src='"+loc);
   document.write ('?rd=' + rd);
   document.write ("'></scr"+"ipt>");
//]]>--></script></div>
<!--eof- banner #6 display -->

</body>
</html>