Illdy Child Theme

Illdy
1

Hello, I’m attempting to create an Illdy Child theme but I’m a bit confused about a couple of things.

I’ve successfully created the child theme and am able to apply the theme to my site. However, the ‘projects section’ in the child theme has spaces between the photos while the parent theme does not.

I’m wondering if it’s related to my next question. Right now, I’m calling the ‘css’ styles of the parent theme in a ‘functions.php’ file in the child theme.

In the parent theme, the css stylesheets are called with the:

@import 'layout/css/main.css';
@import 'layout/css/custom.min.css';

in the ‘style.css’ file.

I’m a bit confused on whether or not I need to call both of these stylesheets separately in my functions.php file. Right now, I just have the copy and pasted php function from the wp child themes tutorial:

<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

}
?>

I guess I’m just wondering, do I just need this one function for the Illdy parent theme? And is this affecting the project photo gaps (if not, how can I fix this?)

2

Hello,

Can you please provide the website link, as well?

Is the child theme working alright, as in it’s displaying everything as expected?

When you use the function you get the parent theme style.css that is already including the 2 main CSS files imported, so there should be no need to include them again.

The images should not be affected by the child theme unless you used some padding code, so website link should clear this out.

Regards

3

When I mark ‘set as private reply’ it won’t post but I don’t want to post my URL publicly. I’ll include what I’m trying to say without the URL and maybe we could figure out a way to get the url posted.

Editing this piece of code in developer tools fixes it in the browser but once I apply this code in the style.css with the fixed padding as ‘0px’, it doesn’t apply. Replacing the padding values in the bootstrap.min.css doesn’t work either.

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

As a clarification, I’m editing the files on cPanel.

Thanks!

4

Hello,

You might want to add the code to layout/css/main.css or simply directly in the childs theme stylesheet.

Let me know if you got it alright.

As for the private message not working, that’s quite strange so you might want to give it another try.

Regards

5

Hi there,

I tried posting the code above into main.css but nothing happened. Then I went into the developer tools and added ‘!important’ to a piece of code I found:

.no-padding {
padding: 0;
}

which worked and I was like ‘woo!’ but then when I went to add into main.css, it didn’t work. :frowning: so close it’s frustrating. I’m not sure why it’s not being picked up in the site.

6

Hello,

This is strange.

Maybe you want to add the code to style.css via Dashboard > Appearances > Editor for a temporary preview, or better yet install a 3rd party CSS plugin to handle the fix code.

Regards

7

Hello,

This is strange.

Maybe you want to add the code to style.css via Dashboard > Appearances > Editor for a temporary preview, or better yet install a 3rd party CSS plugin to handle the fix code.

Regards

8

Putting the code into the editor from the Appearances panel worked for me. I guess I’m trying to make things too complicated haha. Thanks for your help!

9

I ran into the same problem while installing child theme - padding around projects was set to 15px.

The reason for that is that bootstrap css styles are loaded with functions.php script of illdy theme. This script is loaded after the child theme and so styles of the child theme and main.css style are being overwritten.

To solve it, you need to copy the function enqueuing the styles from functions.php from the parent theme and paste it as the very first thing in functions.php of the child theme. The code to copy is here:

if ( ! function_exists( 'illdy_enqueue_stylesheets' ) ) {
	add_action( 'wp_enqueue_scripts', 'illdy_enqueue_stylesheets' );

	function illdy_enqueue_stylesheets() {

		// Google Fonts
		$google_fonts_args = array(
			'family' => 'Source+Sans+Pro:400,900,700,300,300italic',
		);

		// WP Register Style
		wp_register_style( 'illdy-google-fonts', add_query_arg( $google_fonts_args, 'https://fonts.googleapis.com/css' ), array(), null );

		// WP Enqueue Style
		if ( get_theme_mod( 'illdy_preloader_enable', 1 ) == 1 ) {
			wp_enqueue_style( 'illdy-pace', get_template_directory_uri() . '/layout/css/pace.min.css', array(), '', 'all' );
		}

		wp_enqueue_style( 'illdy-google-fonts' );
		wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/layout/css/bootstrap.min.css', array(), '3.3.6', 'all' );
		wp_enqueue_style( 'bootstrap-theme', get_template_directory_uri() . '/layout/css/bootstrap-theme.min.css', array(), '3.3.6', 'all' );
		wp_enqueue_style( 'font-awesome', get_template_directory_uri() . '/layout/css/font-awesome.min.css', array(), '4.5.0', 'all' );
		wp_enqueue_style( 'owl-carousel', get_template_directory_uri() . '/layout/css/owl-carousel.min.css', array(), '2.0.0', 'all' );
		wp_enqueue_style( 'illdy-main', get_template_directory_uri() . '/layout/css/main.css', array(), '', 'all' );
		wp_enqueue_style( 'illdy-custom', get_template_directory_uri() . '/layout/css/custom.min.css', array(), '', 'all' );
		wp_enqueue_style( 'illdy-style', get_stylesheet_uri(), array(), '1.0.16', 'all' );
	}
}

Once you do it, css files will be loaded in the right order (same as in the parent theme).

10

Hello @Amadeusz Annissimo,

Thank you very much for the heads up, this is valuable information for everyone.

Have a nice day!