Sydney free version child theme issues


Quick question:

I’m using the free version of Sydney. Every time I try to use custom CSS code through my child theme’s style.css OR through the simple CSS plugin (including trying a ton of suggestions provided by moderators on this board) none of it ever works. In fact, it seems to do absolutely nothing.

Do I need to upgrade to Sydney pro for custom CSS to take effect? That seems implausible, but it’s the only thing I can think of at this point.


Hello @boywithapple,

Can you please try to add some custom CSS code in DashboardAppearanceCustomizeAdditional CSS (WordPress 4.7 and up) and see if it works?

Kind Regards, Roman.

Hi @Roman

No luck.

I tried this:

.header-wrap .col-sm-4{
    display: none;

No result when I add it.

I’ve also tried a ton of other suggestions from these forums. They just never do anything – which is perplexing because they seem to work for other people in the thread…

I’ve tried clearing the cache (as suggested in other threads) as well. Nothing happens.

Okay @boywithapple,

  1. Please provide a link to your website.

  2. Please describe one of the issues that you want to resolve.

Kind Regards, Roman.

Hi @Roman

OK, the URL is

How about using CSS to disable the sliding text effect in the header upon load?

If I can get this CSS stuff to have an effect, I’ll probably upgrade to the pro version, but I need to make sure this works first!



One thing that is working is the custom JS plugin. I used the below code to put text over the video header. There is a problem with that, too though. When I turn my phone on it’s side (more of a tablet view) and visit the site, the text shows up over the top of the menu!

    "use strict"

    if( $('body').hasClass('home') ) {
    var mainTitle    = 'Welcome to the Future of Charity';
    var subTitle     = 'Clean Energy, Community, Jobs';
    var buttonURL    = '#';
    var buttonLabel  = 'Watch the video';
    var subTitle1  = 'Or, Scroll Down';
    var space = ' '
    var heroContent  = '<div class="slide-inner">';
        heroContent += '<div class="contain text-slider">';
        heroContent += '<h2 class="maintitle">'+mainTitle+'</h2>';
        heroContent += '<p class="subtitle">'+subTitle+'</p>';
        heroContent += '</div>';
        heroContent += '<a href="'+buttonURL+'" class="roll-button border" target="_top">'+buttonLabel+'</a>';
        heroContent += '<h3 class="subtitle">'+space+'</h3>';
        heroContent += '<div class="contain text-slider">';
        heroContent += '<h4 class="subtitle">'+subTitle1+'</h4>';
        heroContent += '</div>';
        heroContent += '</div>';



Hello @boywithapple,

  1. Please try to use the following CSS code in order to disable text slider animation.

You can add CSS code in DashboardAppearanceCustomizeAdditional CSS (WordPress 4.7 and up). Also you can add CSS code directly to style.css file of your child theme.

.slide-inner > .text-slider {
    animation: none;
  1. Please try to use this CSS code in order to prevent overlapping:
.slide-inner {
    margin-top: 130px;

Kind Regards, Roman.