Home>Support>Created child theme for Influence, which made my entire site disappear upon activation

Created child theme for Influence, which made my entire site disappear upon activation

By Jacob Roberts, 9 years ago. Last reply by Magus, 9 years ago.

Using Influence v1.1 on WP 4.2.1.

I created a child theme with the following for the style.css file:

/*
 Theme Name:   Influence Child
 Theme URI:    http://jroberts.net/wp-content/themes/influence-child/
 Description:  Influence Child Theme
 Author:       Jacob Roberts
 Author URI:   http://jroberts.net/
 Template:     Influence
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         Custom Background, Custom Menu, Featured Images, Fluid Layout, Responsive Layout, Theme Options, Threaded Comments, Translation Ready
 Text Domain:  influence-child
 */

And for functions.php:

<?php
//enqueue stylesheets
add_action( 'wp_enqueue_scripts', 'influence_parent_style' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'influence-style', get_template_directory_uri() . '/style.css' );
}

//SVG with PNG fallbacks
echo "<script type="text/javascript">
function supportsSVG() {
  return !! document.createElementNS && !! document.createElementNS('http://www.w3.org/2000/svg','svg').createSVGRect;
}
if (supportsSVG()) {
  document.documentElement.className += ' svg';
} else {
  document.documentElement.className += ' no-svg';
  var imgs = document.getElementsByTagName('img');
  var dotSVG = /.*.svg$/;
  for (var i = 0; i != imgs.length; ++i) {
    if(imgs[i].src.match(dotSVG)) {
      imgs[i].src = imgs[i].src.slice(0, -3) + 'png';
    }
  }
}
</script>";

To configure the child theme, I used Child Theme Configurator v1.7.4.2. The only setting I used other than default settings was to select the option to ‘Copy Parent Theme Menus, Widgets and other Customizer Options.’

After I activated the child theme, I couldn’t see my site from the front or the dashboard. It was all just white. Deleting the functions.php file allowed me to see the dashboard again.

I suspect Influence may be incompatible with the SVG script I added, or that I missed something in the code like an open bracket.

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Jacob

    There are a couple of issues in the functions.php file. Your stylesheet is not being added because the function name does not match the callback in the add action element above. You also cannot echo scripts straight from the functions file. Please try this.

    Remove all code and replace it with this

    [/code]
    <?php
    //enqueue stylesheets
    add_action( 'wp_enqueue_scripts', 'influence_parent_style' );
    function influence_parent_style'() {
    wp_enqueue_style( 'influence-style', get_template_directory_uri() . '/style.css' );
    }
    add_action( 'wp_enqueue_scripts', 'add_svg' );
    function add_svg(){
    //SVG with PNG fallbacks
    echo "
    function supportsSVG() {
    return !! document.createElementNS && !! document.createElementNS(‘http://www.w3.org/2000/svg’,’svg’).createSVGRect;
    }
    if (supportsSVG()) {
    document.documentElement.className += ‘ svg’;
    } else {
    document.documentElement.className += ‘ no-svg’;
    var imgs = document.getElementsByTagName(‘img’);
    var dotSVG = /.*.svg$/;
    for (var i = 0; i != imgs.length; ++i) {
    if(imgs[i].src.match(dotSVG)) {
    imgs[i].src = imgs[i].src.slice(0, -3) + ‘png’;
    }
    }
    }
    “;
    }
    [/code]

    Let us know how you get on

    Magus

  2. 9 years, 4 months ago Magus
    Hi, I Work Here

    code tag failure (damn that autocorrect)

    <?php
 //enqueue stylesheets
 add_action( 'wp_enqueue_scripts', 'influence_parent_style' );
 function influence_parent_style'() {
 wp_enqueue_style( 'influence-style', get_template_directory_uri() . '/style.css' );
 }
 add_action( 'wp_enqueue_scripts', 'add_svg' );
 function add_svg(){
 //SVG with PNG fallbacks
 echo "
 function supportsSVG() {
 return !! document.createElementNS && !! document.createElementNS(‘http://www.w3.org/2000/svg’,’svg’).createSVGRect;
 }
 if (supportsSVG()) {
 document.documentElement.className += ‘ svg';
 } else {
 document.documentElement.className += ‘ no-svg';
 var imgs = document.getElementsByTagName(‘img’);
var dotSVG = /.*.svg$/;
 for (var i = 0; i != imgs.length; ++i) {
 if(imgs[i].src.match(dotSVG)) {
 imgs[i].src = imgs[i].src.slice(0, -3) + ‘png';
 }
 }
 }
“;
 }

    Magus

  3. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Jacob

    Forget that one too, the code tags seem to be stripping out some elements. One last try

    <?php
 //enqueue stylesheets
 add_action( 'wp_enqueue_scripts', 'influence_parent_style' );
 function influence_parent_style'() {
 wp_enqueue_style( 'influence-style', get_template_directory_uri() . '/style.css' );
 }
 add_action( 'wp_enqueue_scripts', 'add_svg' );
 function add_svg(){
 //SVG with PNG fallbacks
echo "<script type="text/javascript">
function supportsSVG() {
  return !! document.createElementNS && !! document.createElementNS('http://www.w3.org/2000/svg','svg').createSVGRect;
}
if (supportsSVG()) {
  document.documentElement.className += ' svg';
} else {
  document.documentElement.className += ' no-svg';
  var imgs = document.getElementsByTagName('img');
  var dotSVG = /.*.svg$/;
  for (var i = 0; i != imgs.length; ++i) {
    if(imgs[i].src.match(dotSVG)) {
      imgs[i].src = imgs[i].src.slice(0, -3) + 'png';
    }
  }
}
</script>";
 }

    Right, try this.

    Magus

  4. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Jacob

    If the above does not work then I would suggest using this plugin to add your svg script

    https://wordpress.org/plugins/header-and-footer-scripts/

    and changing your child theme funtions.php to this

    <?php
 //enqueue stylesheets
 add_action( 'wp_enqueue_scripts', 'influence_parent_style' );
 function influence_parent_style'() {
 wp_enqueue_style( 'influence-style', get_template_directory_uri() . '/style.css' );
 }

    Magus

  5. 9 years, 4 months ago Jacob Roberts

    Thanks. Child theme + that SVG script just won’t work with influence.

    At that point, there’s really no need for a child theme, right? I can just do CSS modifications in jetpack and add scripts via the other plugin.

    Or is there some other reason to create a child theme I’m missing?

  6. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Jacob

    If you are just adding custom CSS and plugins then no, there is no need for a child theme.

    Magus

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More