[catwingz]

Hi again Pratik,

I tried it and believe I learned that the ‘catchresponsive’ part needs to stay in the code. That said, I don’t know that we are on the same track after all. What I want is for the featured image/video to be banner-sized in place of the slider image. These instructions appear to be giving all of the pages a sidebar which is not at all what is desired. The only part of the site which will have a sidebar are the posts. The About page currently has a demo cat video from the Featured Video Plus plugin. If this were working correctly that video would be up in place of the slider, and as large as those slides, and the page would have no sidebar. Can we get there?

Thank you

[catwingz]

Hi Pratik,

Yes, I think we are on the same track now. However, there is one piece of confusion I need to be clear about. In the code for functions.php I started out for code from cleanresponsive because I found it in that forum. Since I am/will be working with Clean Journal/Clean Journal Pro, should I be replacing all instances of catchresponsive with clean-journal, clean-journal-parent or clean-journal-child (or clean-journal-pro, etc.)?

Thank you

[catwingz]

Pratik,

It looks to me like this will replace the slider with a video. Is there any way to make it work for a featured image?

If I use it does it go in the functions.php file?

Thank you

[catwingz]

Tikaram,
I added the code and now the menu shows, but it is in plain text and missing the styling of the menu directly below it. How do I apply the CSS to correct this?

Thank you

[catwingz]

At this point the home page of the site is showing up correctly on mobile some of the time. However, if the menu that you refer to as primary is opened there is no way to close it. The only way to get past it is to click on one of the links. This leads to a page with no logo and the menu we consider to be the main one missing. For the secondary pages the colors of the menu and search bar which show are blue, not the color needed. If I hit the back button to get back to the home page with the rest of the navigation I find that the logo, banner,sidebar, and upper menu have disappeared, leaving the whole site with only what we consider sub-navigation available, and no ‘check availability’ button from the sidebar. This is NOT working!!!

Please help with this. It is a very small hotel and needs to have mobile working properly.

thank you

[catwingz]

Update – I found some code for the top bar colors and went back to check the site again. Now, on the home page only, the slider, logo, menus and check availbility button are all showing. I didn’t do anything and this definitely wasn’t there before – plus it’s a new phone so cache issues are highly unlikely!
If any page link is followed the logo, menu issues and missing sidebar content are all still a problem. It is also odd that when the menu which is most persistent is opened there is no easy way to close it again unless you click on a page link.

Regarding the colors, WordPress decided I was ‘cheating’ and wouldn’t save my CSS changes. The color of the top bar is still blue on all of those pages. I don’t know if what I was going to do is going to work or not.
Fyi, intermittently this site comes up with an old theme hosted on wordpress.com. This is also in the process of being resolved…
thank you in advance.

[catwingz]

Hi Mahesh,

Updating the theme didn’t help, but it turns out that the Easy Testimonials plugin is the cause of the problem. I haven’t used that one before. I will try taking it up with their support. Can you make any suggestions to relay to them?

thank you

[catwingz]

Also, is there a way to make it so the theme can update automatically. Or is the only way to come here to download it and then manually update it?

[catwingz]

Hi Mahesh,

Would it help if I gave you a login?

Thank you

[catwingz]

temporary url

[catwingz]

Now I see what happened. When we were using the free version I added it to the CSS. That was long enough ago that I completely forgot about it. Thanks for pointing that out.

[catwingz]

She likes the large banner on the home page and still wants to have a banner on the other pages. The idea of having it be smaller on the other pages is my thought for a compromise.

[catwingz]

But will that leave the home page with the larger image? She doesn’t want it to change.

Thank you

[catwingz]

Hi,
What she is really trying to achieve is to make the content more immediately viewable. How about making it so that the banner on all except the home page is shorter? Making it a narrower strip on those pages should accomplish this.
Thank you

[catwingz]

If there is a secure way to do so, I would be happy to give you a login to the development site. That’s the only way I can think of for you to see the code in action.

[catwingz]

The url for the public site is here. It has the full sized logo. It has a plugin enabled which redirects it to the separate mobile site we want to retire. Unfortunately the only way to see the development site with the code being discussed here is to be logged into the site.

[catwingz]

@Pratik, it appears there is a need for an in between step of some kind. I am surprised others don’t have this problem. Phone-sized works with the last bit of code. it looks like this

The problem is with tablet-sized or if no extra code is added. where the desktop logo is completely squashed With no extra code it is this way for both tablet and phone sizes. 🙁

Suggestions?

Thank you—I really appreciate the awesome support you guys offer.

[catwingz]

@Mahesh, this isn’t quite the solution I am shooting for. Using this code makes the logo intended for mobile the right size on phones, but also visible on much larger screens than intended. The regular desktop logo is fine on tablets, so the logo only needs to change on phones. However, if I change the max-width back to even 767, the desktop logo distorts vertically. I am also finding that when the new mobile logo is viewed on a phone it is pushed off to the left. This has led me to experiment with a miniaturized version of the desktop one to make use of the extra space on the right.

Up until now we have been using a separate mobile site which uses the smaller vertical logo, displaying it centered on the screen with the text (in the image) beneath the circle. That would be the ideal outcome, but at least getting it so that it only shows on phones would be something I can work with.

Thank you

[catwingz]

Hi,
When it turned out badly I tried changing the height. This produced the same failed results. This is the latest version:

@media screen and (max-width: 767px) {
    #site-logo .custom-logo-link {
        display: none;
    }

    #site-logo {
        background-image: url('http://integrationmassage.com/shadowsite/wp-content/uploads/2017/02/circle-logo-129w.png');
        height: 152px;
        background-size: cover;
        background-repeat: no-repeat;
    }
}

I am working this out on a development site that you can’t see unless you are logged in, so I have created a set of screenshots. At this point I don’t know what (or if) the best size might be for the logo. We’ve been using a separate mobile site and I am hoping to instead switch to taking advantage of the full responsive range of your theme. This problem with the logo is the only roadblock.

This is what the mobile logo should look like
the way it looks with the new code
stretching as screen enlarges – possibly tablet
stretched desktop logo
the full logo on the desktop site

Thank you

[catwingz]

Thanks @Mahesh, that is a huge help. Up until now she hasn’t needed a child theme, but this will make her very happy.

[Author]

Posts