0

Localhost site looks different than live site.

Drupal 7.37 > 7.5 (Commons), viewed in Chrome on Mac OS X.

Prep Steps:

  1. installed a clone of the website from an outdated repository on my local machine
  2. reconciled the code differences between the live site and the slightly outdated repository site
  3. imported a current copy of the database from the live site.
  4. featurized database configurations
  5. updated most of the modules as well as Drupal core.
  6. checked default theme and settings to make sure they are the same between sites

After noticing the problem:

  • downloaded theme files into respective locations
  • installed stage_file_proxy on local dev to load any files I ignored

Thematic Differences

From the moment I imported the database, until now, after all updates have been performed, there is a thematic difference between the live site and my local version. (The difference is slight, but annoying.)

  • live site is centered and contained, local stretches all the way across in some places but stays left aligned in others
  • some fonts are larger on local site
  • navigation menu splits itself to a new line early
  • live site has blocks on the right, local has one column with blocked content at bottom

Summary of Question

Is this a commonly known problem when certain steps are forgotten and is there another place to address configuration besides in the codebase and the database or is this probably not a theming issue but something else?

Update: I pushed the site up to my remote dev server anyways, to see if the problem was environmental or database and codebase. The remote dev looks perfect. There is definitely an issue with my local dev environment causing this somehow.

Improve this question

1 Answer 1

Reset to default
1

Sounds like some CSS files are not loaded on the local site. Or some additional or other CSS files are loaded on the local site.

Clear caches

First thing to start troubleshooting the local site is to clear the caches. Not only CSS/JS caches but all caches.

If the site has the Advagg caching module installed, then sometimes it is not enough to clear its cache by clicking the Administration menu link. Advagg cache might also need to be cleared by clicking the Flush AdvAgg Cache button on this path: /admin/config/development/performance/advagg/operations

If the above does not help then on the same Advagg page there are more buttons to click, hidden behind the headings containing 'Clear' and 'Delete'.

Look at CSS with Firebug

Firebug is an addon for Firefox. Instead of this you can also use the browsers built in inspector by pressing F12(maybe another key on Mac).

See what CSS is different and if the CSS is taken from different files on live site vs local site.

Panels Page layout

Having blocks on the right vs bottom could also be affected by Panels Page layout. Check for that if the blocks are still wrong after you got all other thematic right by getting all CSS right.

Improve this answer
2
  • Something is definitely wrong with either panels or panalizer but I'm not sure what. I use drush to clear my drupal cache frequently, but also clear my browser cookies. I do not have Advagg installed. I will double check the source code for both sites and see if there are any CSS link differences. But even still, how would there be if I reconciled codebase changes and imported current database?
    – Christia
    Oct 15, 2016 at 11:06
  • Maybe the panels code was hacked by a previous developer and when you updated, a panels layout was not there anymore. Checking the source code for links is good but it shows you what the browser should see. If you inspect with Firebug, then you will see what the browser actually sees. When inspecting, you see the CSS selectors and also the CSS-file names and URL's they are downloaded from.
    – Emil Carpenter
    Oct 15, 2016 at 11:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.