Sparkling Child Theme - Download, support, function examples

Hi, I just installed sparkling-child theme however all my setting is not migrated. Is there any quick way to migrate existing setting to child theme?

Thanks

Hi, my way of solving your Q1 is to add another footer.php in the child theme folder and then remove <?php sparkling_footer_info(); ?>. It works for me

I’m using the child theme. I need to edit a function in the inc/extras.php file. How do I edit this file in the child theme?

@startsmartnow

Since extras.php file is not part of default WordPress theme files you can’t overwrite it via Child Theme by taking the entire file and moving it to Child Theme folder.

However, most of the function from that file can be edited via Child Theme functions.php file. All you have to do is to copy the entire function like this to Child Theme functions.php file. Here is an example:

if ( ! function_exists( 'sparkling_call_for_action' ) ) :
/**
 * Call for action text and button displayed above content
 */
function sparkling_call_for_action() {
  if ( is_front_page() && of_get_option( 'w2f_cfa_text' )!=''){
    echo '<div class="cfa">';
      echo '<div class="container">';
        echo '<div class="col-sm-8">';
          echo '<span class="cfa-text">'. of_get_option( 'w2f_cfa_text' ).'</span>';
          echo '</div>';
          echo '<div class="col-sm-4">';
          echo '<a class="btn btn-lg cfa-button" href="'. of_get_option( 'w2f_cfa_link' ). '">'. of_get_option( 'w2f_cfa_button' ). '</a>';
          echo '</div>';
      echo '</div>';
    echo '</div>';
  }
}
endif;

You can edit only those function that has function_exists check added in the original extras.php file. Otherwise WordPress will return error.

Thanks! I will see if that works for what I need to do.

Hi,

I was trying to import the stylesheet with the new preferred method as explained here

`add_action( ‘wp_enqueue_scripts’, ‘theme_enqueue_styles’ );
function theme_enqueue_styles() {
wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );

}`

But it didn’t work. Is the @import the only working method and why doesn’t the new method work?

Thanks.

@jashnu

Original thread updated to include new version for Sparkling Child Theme. Please download it again.

Thanks!

Way better way to do it!

Hi,

I’m trying to increase the height of the navigation / logo bar. I added this to child themes’ functions.php, but it doesn’t work. What is the correct way to increase the height? I can’t find it in the css. Many thanks!


if ( ! function_exists( 'sparkling_custom_header_setup' ) ) {
function sparkling_custom_header_setup() {
	add_theme_support( 'custom-header', apply_filters( 'sparkling_custom_header_args', array(
		'default-image'          => '',
		'default-text-color'     => 'dadada',
		'width'                  => 300,
		'height'                 => 152,
		'flex-height'						 => true,
		'flex-width'						 => true,
		'wp-head-callback'       => 'sparkling_header_style',
		'admin-head-callback'    => 'sparkling_admin_header_style',
		'admin-preview-callback' => 'sparkling_admin_header_image',
	) ) );
}
add_action( 'after_setup_theme', 'sparkling_custom_header_setup' );
}

@jashnu

To make logo/custom header smaller or larger you don’t need to change a single line of code and you don’t even need a Child Theme for that. Recommended image size is 300 by 76 pixels. However, you can use any image size you want. Via Appearance >> Header you can upload your image and then WordPress allows to crop it. You can there select any image size you want by dragging corners of crop area. Make sure that image is big enough to even proceed with cropping because WordPress won’t make it bigger that original image to avoid pixelation .

I noticed that you can upload any size image, but what I really want to achieve is to have the navigation bar vertically aligned in the middle with the logo image. If I have an image with a height greater than 76 px, the navigation stays aligned top so should I just add padding to .navbar-nav > li > a according to the height of the image? E.g. logo image height 152 px (double the original) => 76px more padding => 38px more for top and bottom =>


.navbar-nav > li > a {
    padding-top: 56px;
    padding-bottom: 56px;
}

Any other considerations?

Many thanks!

Hello, Aigars okay?
Again thank you for the excellent free theme!

Find out about this child theme, and I was surprised you help us change some details we want.

I would like to make two on the front page post columns, as could other issues with this feature can not put together the ideas to be able to make this change, you can help me?

Thank you!

I get to do what I wanted, with another theme yours.
To be able to make a home page with 2 columns post I used the source code of your other subject a: pinbin

I glued my child theme css and changed the index, see the code:

Style.css:


.pinbin-copy {
  padding: 20px 8%;
}

/* Post style on frontpage
--------------------------------------------------------------*/
#post-area .post {
  width: 350px;
  background: #FFF;
  margin-right: 25px;
  margin-top: 5px;
  margin-bottom: 20px;
  float: left;
}
#post-area .post .pinbin-copy {
  padding-top: 10px;
  padding-bottom: 10px;
  overflow: hidden;
  clear: both;
  width: 350px;
}

#post-area .post .pinbin-link a {
  text-decoration: none;
  background: #444;
  padding: 5px 10px;
  color: #fafafa;
  font-size: 12px;
  float: right;
  cursor: pointer;
  position: absolute;
  margin-left: 245px;
  margin-top: -15px;
}
#post-area .post .pinbin-link a:hover {
  background: #777;
}

index.php:

get_header(); ?>

	<div id="primary" class="content-area">
		<main id="main" class="site-main" role="main">

		<?php if ( have_posts() ) : ?>

			<div id="post-area">

<?php while (have_posts()) : the_post(); ?>	

   		<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
		 <?php if ( has_post_thumbnail() ) { ?>
         <div class="pinbin-image"><a>"><?php the_post_thumbnail( 'summary-image' );  ?></a></div>
         
		  <?php } ?>
       			<div class="pinbin-copy"><h2><a>"><?php the_title(); ?></a></h2>
                <!--<p class="pinbin-date"><?php the_time(get_option('date_format')); ?>  </p>-->

                  <?php the_excerpt(); ?> 

               <!--<p class="pinbin-link"><a>">&rarr;</a></p>-->
			   <p><a>"><?php _e( 'Read More', 'sparkling' ); ?></a></p>
         </div>
       </div>
       
<?php endwhile; ?>
</div&gt

;

The result was cool, however when I reduce the page to maximize browser it goes along and comes to a point that it is in a single column, however is a very ugly space between the post and the side of the browser, I wanted to leave the size it is the same widgets that is d size that can along with the content, as you would help me to make this appeal, I have no idea how to get.

This already thank you very much for the support and the theme!

I have had problems with a default installation of the latest theme, when using a child theme. I have been using Sparkling for a number of months so have existing content, but this was my first attempt to use the child theme. Because I had problems with the child/upgrade I tried the following:

  1. Changed to another theme
  2. Deleted both main and child theme
  3. Installed Sparkling 1.9.1
  4. Installed child-theme
  5. Activated Sparkling and it works fine
  6. Activated Sparkling-child but the main menu is not shown to visitors (when logged in as admin it just shows ‘ADD A MENU’. I have not made any customisations.

The site is balally.com but is currently set as the main theme so that it displays correctly. I could temporarily revert to the child theme for troubleshooting if requested.

@bgormley

That’s expected behavior and you have to re-enable menu, widgets and other things that might have gone missing. Technically Sparkling theme and Sparkling Child is two different themes. Sparkling Child does depend on Sparkling and you can’t remove it but it has a different ID, so all menus and widgets are not moved to Child Theme automatically.

Let me know if this helps.

I hadn’t thought of it that way but it now makes sense. Thanks

Hello Aigars,
My name is Zach and I have chosen Sparkling for our official website theme because of its great style, customization, and forum support! I appreciate your products and talent.

I have downloaded the provided sparkling-child theme and have followed your instructions to install it but I am experiencing unexpected issues when making simple CSS adjustments (such as changing the default body background-color and hiding the titles at the top of each page.) The parent theme loads appropriately using the enqueued function.php but when I add any CSS to the child style.css file many unexpected changes occur and the code I added does not render. What would you suggest I do to find a solution to this? I appreciate you taking the time to support forum issues.

Thank you,
Zach

When I activete the donwloaded child theme, i have a 1px white border on the whole webpage. When i switch to the parent theme its completly gone. I dont modify anything in the downloaded child. Any ideas?

@c001os

Please start your own thread. This thread is marked as resolved and is not related to your problem. Also make sure to mention your website URL to make it easier to debug it.

Hi, I have a bug : my child css is loaded 2 times.

Here is what i put in my child functions.php :

add_action( 'wp_enqueue_scripts', 'sparkling_enqueue_styles', 15 );
function sparkling_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.min.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style') );
}