Search Results for 'child theme'

[kenlyle]

kenlyle

#268584

I am getting an Error 400 from the Child Theme Builder.

Anyone have a decoder for what that means?

Thanks!

[kenlyle]

kenlyle

#268584

I am getting an Error 400 from the Child Theme Builder.

Anyone have a decoder for what that means?

Thanks!

[kenlyle]

kenlyle

#268583

Related, What are the purposes of the Child Theme Config and Demo Import Config tabs in the Child Theme Builder? Is the right answer for the second one of either Kadence or the name of the Child Theme?…meaning is it OK to have the same name for both?
And, typically, the same image?

[kenlyle]

kenlyle

#268576

There are some scattered bits about this in the forum, but I am looking for a consolidated answer.

I had to do some work, create some Woo products, etc. on the sites I am using to package my child themes. I actually like having a functioning preview before I package.

Do I need to delete or mark draft (easier) my Woo Products before running the Child Theme builder?

And Deactivate any plugins that I don’t want packaged?

If I deactivate Woo, will that automatically exclude Woo products, variations, etc.?, or do I need to do both?

Generally, should I Draft anything (Posts, Pages) that I don’t want to include in the exported Child Theme?

Anything else?

Basically, looking for something like documentation.

Thanks!

[kenlyle]

kenlyle

#268576

There are some scattered bits about this in the forum, but I am looking for a consolidated answer.

I had to do some work, create some Woo products, etc. on the sites I am using to package my child themes. I actually like having a functioning preview before I package.

Do I need to delete or mark draft (easier) my Woo Products before running the Child Theme builder?

And Deactivate any plugins that I don’t want packaged?

If I deactivate Woo, will that automatically exclude Woo products, variations, etc.?, or do I need to do both?

Generally, should I Draft anything (Posts, Pages) that I don’t want to include in the exported Child Theme?

Anything else?

Basically, looking for something like documentation.

Thanks!

[phoebemoondesigns]

phoebemoondesigns

#268549

I am following the directions on https://www.kadencewp.com/kadence-theme/knowledge-base/advanced/what-is-a-child-theme-should-i-install-one-if-so-how/

The beginning of that article states, “For most users, a child theme is not needed with Kadence since Kadence has been meticulously crafted to be customizable via the WordPress Customizer.” But if you don’t have a child theme, aren’t you risking the design of the site when Kadence does an update? Are the starter templates considered child themes?

At the very bottom is a comment that says, “If you want to have the child theme enqueue your child theme style.css file….” and it goes on to explain how to do this. But do I want to? To me, enqueue means “put into a line”. Wouldn’t I want the child theme style.css to override the main file?

Thanks for your help.

Kris

[mecra]

mecra

#268413

Yes of course!
As i told it works, i clean cache all the time
for example before i edited 3 files!

template-parts > content > comments-list.php entry_related.php single-entry.php
And no problem! 3 files edited and theme read the child php files when i make changes on it.

BUT!
In this original kadence folder /inc/components/comments/
there is a function.php and i think wee need to do something in here

I think we need to do something with /inc/components/comments/function.php
Should we add any line to child kadance theme function.php?

Thanks

[mecra]

mecra

#268398

I use this Kadence Child Theme
*Login to see link
*Login to see link
It works

But in a folder it does not work!
I want to change component.php (inc/components/comments/component.php)

So i created /inc/components/comments/ folders in child theme and i edited component.php and send it to last folder

For example;

I changed this

$fields['author'] = '<div class="comment-input-wrap ' . ( $show_web ? 'no-url-field' : 'has-url-field' ) . '"><p class="comment-form-author"><input aria-label="' . esc_attr__( 'Name', 'kadence' ) . '" id="author" name="author" type="text" placeholder="' . esc_attr__( 'John Dow', 'kadence' ) . '" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" maxlength="245"' . $aria_req . ' /><label class="float-label" for="author">' . esc_html__( 'Name', 'kadence' ) . $label_req . '</label></p>';

TO

$fields['author'] = '<div class="comment-input-wrap ' . ( $show_web ? 'no-url-field' : 'has-url-field' ) . '"><p class="comment-form-author"><input aria-label="' . esc_attr__( 'İsminiz', 'kadence' ) . '" id="author" name="author" type="text" placeholder="' . esc_attr__( 'Mert Can', 'kadence' ) . '" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" maxlength="245"' . $aria_req . ' /><label class="float-label" for="author">' . esc_html__( 'İsminiz', 'kadence' ) . $label_req . '</label></p>';

Changed elements=

esc_attr__( ‘Name’, ‘kadence’ ) ———-> esc_attr__( ‘İsminiz’, ‘kadence’ )
esc_attr__( ‘John Dow’, ‘kadence’ ) ——-> esc_attr__( ‘Mert Can’, ‘kadence’ )
esc_html__( ‘Name’, ‘kadence’ ) ——–> esc_html__( ‘İsminiz’, ‘kadence’ )

But when i refreshed page but nothing changed

What should i do Where is the problem do you think thanks

[mecra]

mecra

#268398

I use this Kadence Child Theme
*Login to see link
*Login to see link
It works

But in a folder it does not work!
I want to change component.php (inc/components/comments/component.php)

So i created /inc/components/comments/ folders in child theme and i edited component.php and send it to last folder

For example;

I changed this

$fields['author'] = '<div class="comment-input-wrap ' . ( $show_web ? 'no-url-field' : 'has-url-field' ) . '"><p class="comment-form-author"><input aria-label="' . esc_attr__( 'Name', 'kadence' ) . '" id="author" name="author" type="text" placeholder="' . esc_attr__( 'John Dow', 'kadence' ) . '" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" maxlength="245"' . $aria_req . ' /><label class="float-label" for="author">' . esc_html__( 'Name', 'kadence' ) . $label_req . '</label></p>';

TO

$fields['author'] = '<div class="comment-input-wrap ' . ( $show_web ? 'no-url-field' : 'has-url-field' ) . '"><p class="comment-form-author"><input aria-label="' . esc_attr__( 'İsminiz', 'kadence' ) . '" id="author" name="author" type="text" placeholder="' . esc_attr__( 'Mert Can', 'kadence' ) . '" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" maxlength="245"' . $aria_req . ' /><label class="float-label" for="author">' . esc_html__( 'İsminiz', 'kadence' ) . $label_req . '</label></p>';

Changed elements=

esc_attr__( ‘Name’, ‘kadence’ ) ———-> esc_attr__( ‘İsminiz’, ‘kadence’ )
esc_attr__( ‘John Dow’, ‘kadence’ ) ——-> esc_attr__( ‘Mert Can’, ‘kadence’ )
esc_html__( ‘Name’, ‘kadence’ ) ——–> esc_html__( ‘İsminiz’, ‘kadence’ )

But when i refreshed page but nothing changed

What should i do Where is the problem do you think thanks

[michaeljdeibert]

michaeljdeibert

#268191

Hi Ben,

As I was going through the final checks, I noticed that even though this css adjustment shows the desktop grid down to 1024px (working correctly), there’s a conflict with block display visibility. This is only evident in my sidebar elements, where I have some row blocks set to be hidden on Tablet.
An example can be seen here: https://staging7.queerfilmreviews.com/2021/07/queer-western-films/

In Developer, I’ve pinpointed the media query & css that *should* change this – but while it works in Developer, it’s not actually working on the front end (even after clearing all caches).

Here’s the css I added:

@media screen and (min-width:1024px){
.kvs-lg-false {
     display:none !important;
    }
}
@media (min-width: 768px) and (max-width: 1023px) {
.kvs-md-false {
    display: none !important;
    }
}

Again, changing the existing media query to note the max-width of 1023px (instead of the theme 1024px) works fine in Developer – but not elsewhere. It’s as if it’s being overruled – even placing that css in the child’s styles.css file. Is there another place within the theme that I also need to target? Or am I targeting the wrong selector?

I even tried to pinpoint it even further with: .entry-content .wp-block-kadence-rowlayout .kvs-md-false to no avail. But simply targeting the root .kvs-md-false selector should work site-wide.

I hope this is the last element with this, unless there’s anything else you might think should be checked?

Michael

[Karla]

Karla

#268101

Hi,

Apologies if I missed your questions.

“And changing the screen pixel to 1023px to force a tablet-landscape mode is not displaying correctly either. So do I need to target a more specific class to force desktop layout on 1024px? or go even broader?”

So here is a custom CSS code that can be used to show the desktop layout for 1024px above and start the tablet mode on 1023px:

@media screen and (min-width: 1024px) {
    .has-left-sidebar .content-container {
        grid-template-columns: 2fr 5fr!important;
    }

    .has-sidebar .content-container {
        display: grid;
        grid-template-columns: 5fr 2fr;
        grid-gap: var(--global-xl-spacing);
        -webkit-justify-content: center;
        justify-content: center;
    }
    .has-left-sidebar #main {
        grid-column: 2;
        grid-row: 1;
    }
    .has-left-sidebar #secondary {
        grid-column: 1;
        grid-row: 1;
    }
    .has-left-sidebar .has-sidebar .content-container .kadence-thumbnail-position-behind.alignwide {
        margin-left: -10px;
        margin-right: -10px;
    }
    .has-sidebar .content-container .kadence-thumbnail-position-behind.alignwide {
        margin-left: -10px;
        margin-right: -10px;
        max-width: calc(100% + 20px);
    }
}

This should work with the left/right sidebar layout – https://share.getcloudapp.com/yAuyE6Lx.

“I have my child theme… should that css go into the child theme’s styles.css instead of Customiser’s “Additional CSS” in order for it to load even earlier?”

Placing custom CSS code inside the child theme’s style.css file will make the styles load earlier than the ones from the Customizer > Additional CSS. However, it still should work if you put them in the additional CSS field.

Unfortunately, I cannot say much about feature requests as the development team are the one doing the planning for these additional features. I would send a note to them regarding this so they can address the request regarding “specifically to include ORIENTATION options at 1024px”(tablet).

Regards,
Karla

[michaeljdeibert]

michaeljdeibert

#268047

Hi,

1024px is a tricky screen size to target. It’s the upper range of the longest possible resolution size for tablets (according to THIS chart.

Some designers want to keep all tablet sizes the same, whether in portrait or landscape orientation. But others, myself included, want to use a horizontal orientation when the tablets are horizontal, especially when sidebars are included (as they often are on desktop layouts).

Right now, that’s not possible via Customiser and I’m running into troubles achieving it via CSS.
[Note, there is already a theme feature request with 49 upvotes… so this customisation seems wanted.]

It’s been noted that the current Kadence breakpoints are:
– 1024px and above: Desktop
– below 1024px to 768px: Tablet
– below 768px: Mobile

Except when viewing the actual @media queries in all.min.css, the actual desktop layout option targets 1025px and above… not 1024px.

@media screen and (min-width: 1025px){.has-sidebar .content-container{display:grid;grid-template-columns:5fr 2fr;grid-gap:var(--global-xl-spacing);-webkit-justify-content:center;justify-content:center}...}

1. Could we get an option, ideally via customiser, to include orientation options for tablets? Or get a query rewrite that includes orientation that is then customisable in Customiser with a select option? i.e. to allow landscape orientation to display desktop layout. (if not, then it defaults to tablet layouts instead.)

______________

2. My Current CSS Issue:

Working with Ben, we’ve included css to adjust the paddings regarding my right sidebar. The target screen size in our css is min-width:1024px.

/* remove padding for sidebar template and allow full-width within inner content area */

@media screen and (min-width:1024px) {
.has-sidebar .content-container {
max-width: 100%;
padding: 0;
grid-template-columns: 70% 30%;
grid-gap: 0;
}
.has-sidebar .site .content-container .alignwide, .has-sidebar .site .content-container .alignfull {
margin-left: -90px;
margin-right: -60px;
}
.has-sidebar .site .content-container .wp-block-kadence-column .alignwide, .has-sidebar .site .content-container .wp-block-kadence-column .alignfull {
margin-left:0;
margin-right:0;
}
}

It should be overwriting the “grid-template-columns:” choice in the all.min.css code cited above – but it’s not. And changing the screen pixel to 1023px to force a tablet-landscape mode is not displaying correctly either.
[Tested both in Chrome developer in their desktop = 1024px screen size, but also in a custom iPad-Horizontal size – and on my ipad itself in landscape orientation. As usual, all caches cleared, no change.]

However, when I adjusted the few other css changes that involve the 1024px media query, those ARE adjusted. So do I need to target a more specific class to force desktop layout on 1024px? or go even broader?
I have my child theme… should that css go into the child theme’s styles.css instead of Customiser’s “Additional CSS” in order for it to load even earlier?

Help would be appreciated. Thanks!

[michaeljdeibert]

michaeljdeibert

#268047

Hi,

1024px is a tricky screen size to target. It’s the upper range of the longest possible resolution size for tablets (according to THIS chart.

Some designers want to keep all tablet sizes the same, whether in portrait or landscape orientation. But others, myself included, want to use a horizontal orientation when the tablets are horizontal, especially when sidebars are included (as they often are on desktop layouts).

Right now, that’s not possible via Customiser and I’m running into troubles achieving it via CSS.
[Note, there is already a theme feature request with 49 upvotes… so this customisation seems wanted.]

It’s been noted that the current Kadence breakpoints are:
– 1024px and above: Desktop
– below 1024px to 768px: Tablet
– below 768px: Mobile

Except when viewing the actual @media queries in all.min.css, the actual desktop layout option targets 1025px and above… not 1024px.

@media screen and (min-width: 1025px){.has-sidebar .content-container{display:grid;grid-template-columns:5fr 2fr;grid-gap:var(--global-xl-spacing);-webkit-justify-content:center;justify-content:center}...}

1. Could we get an option, ideally via customiser, to include orientation options for tablets? Or get a query rewrite that includes orientation that is then customisable in Customiser with a select option? i.e. to allow landscape orientation to display desktop layout. (if not, then it defaults to tablet layouts instead.)

______________

2. My Current CSS Issue:

Working with Ben, we’ve included css to adjust the paddings regarding my right sidebar. The target screen size in our css is min-width:1024px.

/* remove padding for sidebar template and allow full-width within inner content area */

@media screen and (min-width:1024px) {
.has-sidebar .content-container {
max-width: 100%;
padding: 0;
grid-template-columns: 70% 30%;
grid-gap: 0;
}
.has-sidebar .site .content-container .alignwide, .has-sidebar .site .content-container .alignfull {
margin-left: -90px;
margin-right: -60px;
}
.has-sidebar .site .content-container .wp-block-kadence-column .alignwide, .has-sidebar .site .content-container .wp-block-kadence-column .alignfull {
margin-left:0;
margin-right:0;
}
}

It should be overwriting the “grid-template-columns:” choice in the all.min.css code cited above – but it’s not. And changing the screen pixel to 1023px to force a tablet-landscape mode is not displaying correctly either.
[Tested both in Chrome developer in their desktop = 1024px screen size, but also in a custom iPad-Horizontal size – and on my ipad itself in landscape orientation. As usual, all caches cleared, no change.]

However, when I adjusted the few other css changes that involve the 1024px media query, those ARE adjusted. So do I need to target a more specific class to force desktop layout on 1024px? or go even broader?
I have my child theme… should that css go into the child theme’s styles.css instead of Customiser’s “Additional CSS” in order for it to load even earlier?

Help would be appreciated. Thanks!

[Karla]

Karla

#267987

Hello,

Apologies for the delay in getting back to you!

Do I need to replicate all the customizations I did in Kadence in the child theme now?

You can export the customizer theme settings from the parent to the child by installing and activating the Kadence Starter Templates plugin so you’ll have the Import/Export option in the Customizer.

Here’s a screen recording for your reference – https://share.getcloudapp.com/JruxQe7Q.

Is there a smarter way to add the Google Analytics code to the header?

If you have the Kadence Pro addon, you can enable the Header/Footer Scripts feature and add the GA code in Customizer > Custom Scripts – https://kadence-theme.com/knowledge-base/pro-addon/how-to-add-scripts-in-header-footer/.

Otherwise, you may use third-party plugins like the ones recommended here – https://wordpress.org/plugins/kadence-starter-templates/.

Hope this helps and let us know if we can assist you further.

Best Regards,
Karla

[ed-2468]

ed-2468

#267964

Yes, did use that and even tested with your downloadable functions.php and styles.css files. Now I’m thinking it’s actually just that I’m losing all the theme options I’ve set up in the customizer when I switch to the child theme, not that the kadence styles are failing to load. Could that be the case?

• This reply was modified 4 years, 7 months ago by ed-2468.

[Chris]

Chris

#267951

Hello,

Have you attempted using this?

https://kadence-theme.com/knowledge-base/advanced/what-is-a-child-theme-should-i-install-one-if-so-how/

Thanks!

Chris

[ed-2468]

ed-2468

#267949

Just trying to set up a simple child theme so I can add the Google Analytics tag in the header with a php function in functions.php without worrying about losing the function every time I update Kadence.

But for the life of me I cannot get the Kadence styles to load when I select my child theme. I’ve done this plenty of times before with other themes and I’ve gone over every inch of my code but still can’t get those styles to load. What am I doing wrong?

I created a directory in the wp-content/themes folder called “kadence-child.” In that directory I added a file “styles.css”:

Then I added a file “functions.php”:

I’ve confirmed the kadence theme is in wp-content/themes/kadence. When I go to Appearance>Themes in my WordPress dashboard and select the “live preview” button on the child theme box, none of the customizations I did in Kadence are loading.

Do I need to replicate all the customizations I did in Kadence in the child theme now?

Is there a smarter way to add the Google Analytics code to the header?

Thank you.

[ed-2468]

ed-2468

#267949

Just trying to set up a simple child theme so I can add the Google Analytics tag in the header with a php function in functions.php without worrying about losing the function every time I update Kadence.

But for the life of me I cannot get the Kadence styles to load when I select my child theme. I’ve done this plenty of times before with other themes and I’ve gone over every inch of my code but still can’t get those styles to load. What am I doing wrong?

I created a directory in the wp-content/themes folder called “kadence-child.” In that directory I added a file “styles.css”:

Then I added a file “functions.php”:

I’ve confirmed the kadence theme is in wp-content/themes/kadence. When I go to Appearance>Themes in my WordPress dashboard and select the “live preview” button on the child theme box, none of the customizations I did in Kadence are loading.

Do I need to replicate all the customizations I did in Kadence in the child theme now?

Is there a smarter way to add the Google Analytics code to the header?

Thank you.

[Karla]

Karla

#267942

Hello,

Thank you for reaching out to us.

There is no option for this within the Kadence Theme infinite scroll. Our infinite scroll option is applied for archive pages only.

Some of the Kadence Theme customers are using third-party plugins like Ajax Load More. If you plan to use this, here are the steps on how to implement it:

• Create a child theme. This is important in overriding any theme template file so your changes will not be removed whenever you update the theme.
• Copy the single.php of the Kadence parent theme from the “/template-parts/content” folder and add the code in a single.php file on your child theme in the same location.
• Edit the single.php file on the child theme to insert the shortcode of the plugin as instructed on this page.

Lastly, there is an existing feature request for this already, you may add your vote or comment on additional information on this page. However, please note that we cannot give an ETA of when this will be available as the development team considers certain factors before implementing new ones.

Hope this helps and let us know if we can assist you further.

Regards,
Karla

[Karla]

Karla

#267940

Hello Anthony,

Thank you for sharing how the issue was resolved on your end.

I tried replicating the issue with the child theme – https://share.getcloudapp.com/JruxEr2G. You’ve also said in your update that “NOTE: after updating the parent theme to 1.9.19 the errors were gone.”.

Please could you confirm if all issues are now resolved?

Kind Regards,
Karla

[Hannah]

Hannah

#267934

Hey! Have you looked into our Kadence Child Theme Builder? It may be perfect for what you’re after! https://www.youtube.com/watch?v=5qsPHrOd1qY
Hope it helps!

Best,
Hannah

[Peter]

Peter

#267919

Hi Karla,

Ok so after clearing all caching the 2021 theme allowed me into the WordPress Admin.

There was no update to the Ascend theme however I noticed the latest version was different to the one I had installed. I had 1.9.1 where the latest was 1.9.19. This is now installed however the child theme now cannot be recognised. I’ve removed and redownloaded it from https://www.kadencewp.com/child-themes/ without success.

Any suggestions?

NOTE: after updating the parent theme to 1.9.19 the errors were gone.

Thanks,
Anthony

[ardraug]

ardraug

#267877

Hi Hanna,

thanks for your answer. Unfortunately it doesn’t work for me. I need to display latest posts with a true value in a certain meta key and stop showing when value comes false.

So I will create new method in the child theme to solve this.

Thanks anyway 🙂

[Romain Guenot]

Romain Guenot

#267729

Hi,

Sorry for my late answer tho I really appreciate your help.

I do not have any optimization plugin. I’ve tried to deactivate all of my plugin but afterwards the issue still remained.

The only way for me to get it to work is to always change the number at the end of
wp_enqueue_style( 'child-theme', get_stylesheet_directory_uri() . '/style.css', array(), 100);
: https://share.getcloudapp.com/9ZuQgYoj

[Karla]

Karla

#267722

Hi Greg,

When using the Kadence Child Theme Builder, does the source child theme have to remain online after it has been imported into the target site?

Basically, the child theme’s demo website has to remain online and publicly accessible so the customers who bought it will be able to import the templates, images, content of the child theme. However, if you only have one client and they’ve already installed and imported the child theme with the templates, then I believe you can disable the demo website already.

And once imported, does the new site have full editing capabilities (including the ability to change the design of the theme)?

Yes, the child theme will work just like any other theme. They should have full editing capabilities.

Hope this helps.

Best Regards,
Karla