Homepage help

Hello

I have two major issues with my homepage which I have been editing with Cornerstone:

  1. The image below the heading in the Cornerstone ‘Welcome’ block is being zoomed in and not displayed correctly. How can I adjust to get the right cropping? e.g. Do I need to set up the row a certain size and crop to that exact size?

  2. In the Recent Posts shown later in the same page, the image thunbnails are not showing. Can you explain how to show the featured images alongside the post titles?

Kirsty

My URL is: www.worldforagirl.com

Hi Kirsty,

1.) Background image is too large. Try using background with 1600x800 size. CSS files like this: http://worldforagirl.com/wp-content/themes/x/framework/css/dist/site/stacks/renew.css?ver=5.1.0 has missing content. We found out that this issue is because of either Cloudflare or any plugin auto minifier. The theme already minifies CSS and JS files. Minifying it again causes breakage on the file resulting to design issues like this. Please disable auto minifier.

2.) Let’s check this issue after fixing the issue on #1. It might be related to that.

Let us know how this goes.

That worked for the homepage image, thanks! Could you help with my remaining questions please?

  1. I’ve disabled the auto-minify within Wordpress but the blog thumbnail images still don’t appear. However, I’ve used a Content View (from Post Grid) on the Blog page which was created with [pt_view id=“1aca58dv52”]. I’ve tried using this as a code snippet on the front page but you can see I get an error message. How do I get the same view as the Blog page on the homepage?

  2. The Navigate button that shows on mobile devices for the main menu shows but does not do anything when I click it. An Apex search suggests that I need to install the x shortcode plug-in, but I can’t see where to do this. Perhaps it’s related to point 4) below. How can I get the Navigate button to work?

  3. There’s an issue with Cornerstone preview and I only get the skeleton view. I think this is because I have removed and reinstalled Cornerstone. When I did this, it asked me to validate with my license key. However, it did not recognise my license key. How do I get the Cornerstone preview to work?

2.It sounds like you might be having an issue with a third party plugin or script. Regretfully, we cannot provide support for third party plugins or scripts as our support policy in the sidebar states due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s plugin or script. Because of this, any questions you have regarding setup, integration, or troubleshooting any piece of functionality that is not native to X will need to be directed to the original developer.

3-4. A Javascript conflict might be causing this. Please try removing customizations and try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Thanks.

Thanks for your response. I’ve tried the advice but don’t have resolution - could you reply again please?

  1. I’m a new Wordpress and X Theme user and think that I’m doing something stupid/wrong, rather than there being an issue with the third party plug-in. The reason that I think this is that the plug-in is working fine directly with Wordpress; the issue only arises when I’ve tried to use it with Cornerstone. I think the problem is that I’m using Cornerstone incorrectly. So, please answer the question generically. If I have a piece of code (shortcode?!) that works when in the Text Composer of a Wordpress box, is it possible to get it to work within a Cornerstone row and column? I’ve tried adding the code as a code snippet in the Cornerstone row and column but this is giving the error message.

  2. and 4) I’ve tried deactivating each plug-in but the issue persists. If it’s easier, I’m not tied into having the ‘Navigation’ button. Most mobile sites have a ‘hamburger / 3 horizontal lines’ style button which does the menu drop-down and I’d be happy with that. So, if it’s too difficult to solve the ‘Navigate’ button issue, then how do I put a ‘hamburger’ solution in?

Hi @Kirsty,

2.)Thank you for the clarification. Please add the shortcode using RAW CONTENT or Text element. Those 2 elements process shortcodes. Code Snippet will just displayed it as it is not processed it.

3.) and 4.) I find it really weird that it will show navigation text instead of hamburger menu. Try to clear cache to make sure that we’re seeing updated content. If the issue persist, would you mind providing us with login credentials so we can take a closer look? Please provide following information:

Set it as Secure Note

  • Link to your site
  • WordPress Admin username / password

Thanks for your help on 2), I’ve got it working now.

For 3) and 4), I tried clearing the cache but this didn’t work. Could you login and take a look please? Password is Apexhelp123

I’ve also got some additional problems that I’d like some support with:

  1. For some reason I have 2 headings at the top of every page. I only want the purple heading. Could you see how to remove the black one?

  2. When displaying the heading on a mobile device, I’d like to shrink the heading so that the top of the remainder of the pages starts displaying (at the moment it looks like the pages aren’t changing even though they are.

  3. The header photo that you helped with looks great on the tablet I’m working on. However, on a mobile device it only selects a portion of the photo and this doesn’t look very good. How can I get it to look good on a mobile? Can I make the photo responsive so that it shrinks?

Kirsty

I’ve had to change the password again as I didn’t mean to publish it above. Will send below as a secure note.

Hi Kirsty,

3&4. I found out that this CSS file :http://worldforagirl.com/wp-content/themes/x/framework/css/dist/site/stacks/renew.css?ver=5.1.0 is still incomplete. There’s something that cause breakage on the file resulting to style issues like this. We found out that this is because of auto minification from a plugin. Please disable autominification.
Since more than half of those files is missing, it will cause a lot of styling issues. Let’s check again after disabling auto minification. Then clear cache before checking again.

I’ve disabled the minification (sorry - I thought I had already done this). I’ve checked back but don’t see an improvement. Could you look again please?

Hi Kirsty,

I can see autominify is already disabled though the same issue still exists. Please try clearing cache and then disable W3 Total Cache plugin totally. Check again after that.

I’ve tried these steps but there’s no change. I’ve left this plug-in deactivated. It’s left in this state currently. Also, previously I’ve deactivated all plug-ins but the problem was still there.

Could you take a look again please?

Also, could you give some feedback on the other items please?

Hello There,

Thanks for updating in! It seems that you are using CloudFlare. In CloudFlare, CSS minification may also be set as enabled. Could you please disable it? For better results, please apply the suggested CloudFlare settings from this tip: https://xthemetips.com/using-cloudflare-rocket-loader-with-x-pro-and-x5/928/

Hope this helps. Please let us know how it goes.

That works for the menu dropdown, thanks! Could you look into the other issues please?

Hello There,

Thanks for updating in! Glad it works out for you.

5.) To remove the black heading text, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r) or in the customizer, Appearance > Customize > Custom > Edit GLOBAL CSS

.visually-hidden, .screen-reader-text, .screen-reader-response, .bp-screen-reader-text {
    display: none;
}

6.) To resize your heading text, you can make use of this custom css

@media(max-width: 979px){
  .masthead-stacked .x-brand {
    font-size: 30px;
  }
}

7.) Which photo you are referring to? Is it the background image of the section in your homepage? I would recommend that you check out this thread: https://community.theme.co/forums/topic/section-background-image-2/#post-691126 so that you have have a full understanding of how the background images in sections would work.

Hope this helps. Please let us know how it goes.

Hi, thanks for the help removing the black header for 5), it worked!

  1. I added the code and cleared the cache. Could you check why it’s not working please?

  2. The Cornerstone skeleton view is tiny and I can’t see the updates. Do you know why this is?

Checking back later, the text has resized for 6). Could you look at 4) please.

Hello There,

Thanks for updating in! Glad to know that it works out for you.
For your last inquiry, please keep in mind that the skeleton view will take you to a closer look of the Cornerstone elements you have inserted in the sections. You can see all elements including those elements that are hidden for specific screen sizes. The preview is just a little thumbnail and this is the default. http://prntscr.com/fwkxe8

Hope this explains it briefly.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.