Site just loading

Hello,

I have loaded your theme, Perth, onto a new subdomain https://mediakit.littlerozmoments.com/

I have used this theme twice before on other sites, but for some reason on this one, it just keeps loading…

I have created a homepage and set it as a front page template. I have selected a static front page and selected the homepage. I have created a test row and widget. I have also added a background image in the theme customization section, but still, nothing loads…

It sits in loading even when you are trying to edit it using the customizer.

Please can you advise.

Many thanks

Hello there,

Is this happened from the first time or just a sudden? Is your other site has cloudflare enabled? The web browser console window is displaying an error which is coming from cloudflare CDN. Would you mind trying to disable it temporarily? See if it resolves the trouble.

Regards,
Kharis

Hello,

This happened for the first time. I only created the subdomain yesterday so this is a brand new site with a fresh WordPress installation.

I have been speaking with my hosting provider and Cloudflare and everything is configured correctly.

When I install another theme, everything loads fine. (Please see - https://mediakit.littlerozmoments.com/ …current the theme Twenty Seventeen is activated).

I have re-activated the Perth theme, but still, it sits in loading.

Please can you help?

P.S. I’ve just installed your Astrid theme, and that works fine. Just your Perth theme (the one that I would like) that I am having trouble with.

Hello there,

I am sorry to hear that you’ve into issue. I inspected your site with the browser’s console window; it’s displaying that the fitvids.js doesn’t load properly. To fix this, you should manually call this script by doing these steps:

  1. Install and activate Insert Headers and Footers plugin that will allow you to insert JavaScript (jQuery) code.

  2. Visit Settings menu > Insert Headers and Footers > add the following code to Scripts in Header section:


<script>
/*jshint browser:true */
/*!
* FitVids 1.1
*
* Copyright 2013, Chris Coyier - http://css-tricks.com + Dave Rupert - http://daverupert.com
* Credit to Thierry Koblentz - http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/
* Released under the WTFPL license - http://sam.zoy.org/wtfpl/
*
*/

;(function( $ ){

  'use strict';

  $.fn.fitVids = function( options ) {
    var settings = {
      customSelector: null,
      ignore: null
    };

    if(!document.getElementById('fit-vids-style')) {
      // appendStyles: https://github.com/toddmotto/fluidvids/blob/master/dist/fluidvids.js
      var head = document.head || document.getElementsByTagName('head')[0];
      var css = '.fluid-width-video-wrapper{width:100%;position:relative;padding:0;}.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {position:absolute;top:0;left:0;width:100%;height:100%;}';
      var div = document.createElement("div");
      div.innerHTML = '<p>x</p><style id="fit-vids-style">' + css + '</style>';
      head.appendChild(div.childNodes[1]);
    }

    if ( options ) {
      $.extend( settings, options );
    }

    return this.each(function(){
      var selectors = [
        'iframe[src*="player.vimeo.com"]',
        'iframe[src*="youtube.com"]',
        'iframe[src*="youtube-nocookie.com"]',
        'iframe[src*="kickstarter.com"][src*="video.html"]',
        'object',
        'embed'
      ];

      if (settings.customSelector) {
        selectors.push(settings.customSelector);
      }

      var ignoreList = '.fitvidsignore';

      if(settings.ignore) {
        ignoreList = ignoreList + ', ' + settings.ignore;
      }

      var $allVideos = $(this).find(selectors.join(','));
      $allVideos = $allVideos.not('object object'); // SwfObj conflict patch
      $allVideos = $allVideos.not(ignoreList); // Disable FitVids on this video.

      $allVideos.each(function(){
        var $this = $(this);
        if($this.parents(ignoreList).length > 0) {
          return; // Disable FitVids on this video.
        }
        if (this.tagName.toLowerCase() === 'embed' && $this.parent('object').length || $this.parent('.fluid-width-video-wrapper').length) { return; }
        if ((!$this.css('height') && !$this.css('width')) && (isNaN($this.attr('height')) || isNaN($this.attr('width'))))
        {
          $this.attr('height', 9);
          $this.attr('width', 16);
        }
        var height = ( this.tagName.toLowerCase() === 'object' || ($this.attr('height') && !isNaN(parseInt($this.attr('height'), 10))) ) ? parseInt($this.attr('height'), 10) : $this.height(),
            width = !isNaN(parseInt($this.attr('width'), 10)) ? parseInt($this.attr('width'), 10) : $this.width(),
            aspectRatio = height / width;
        if(!$this.attr('name')){
          var videoName = 'fitvid' + $.fn.fitVids._count;
          $this.attr('name', videoName);
          $.fn.fitVids._count++;
        }
        $this.wrap('<div class="fluid-width-video-wrapper"></div>').parent('.fluid-width-video-wrapper').css('padding-top', (aspectRatio * 100)+'%');
        $this.removeAttr('height').removeAttr('width');
      });
    });
  };
  
  // Internal counter for unique video names.
  $.fn.fitVids._count = 0;
  
// Works with either jQuery or Zepto
})( window.jQuery || window.Zepto );

</script>

  1. Save
  2. Clear site caching (if enabled) from your site admin

Let me know how it goes.

Regards,
Kharis

Sorry, I forgot to link the plugin. Here it is: