Remove masonry footer information - Support | Kriesi.at

Tagged: ismael, Nikko, rikard

Viewing 30 posts - 1 through 30 (of 41 total)

1 2 →

Author

Posts
May 23, 2017 at 9:08 pm #798501

ccyran
Participant

Hey guys,

I was given this CSS to remove the “Related tags” text that appears at the bottom of Masonry Portfolio galleries…

.single portfolio .blog-tags, .single-portfolio .page-thumb, .single-portfolio .jp-relatedposts {
display: none !important;
}

It works, but now when I scroll down a page that includes the masonry gallery element, there’s a slight page jump. I’ve tested all my custom CSS and found that the problem goes away if I don’t use the CSS above.

So in short, I want to still remove the related tags, but not have the website jump. I think it’s a modification in the CSS above, or a new one entirely.

Screenshot of what im referring to:
https://ibb.co/eHc6iF

Website:

Zach Wilson

Password in private content

Thanks!

May 24, 2017 at 12:40 am #798637

Jordan Shannon
Inactive Moderator

Hey ccyran,

I am looking at the page you linked but can’t see the jump you are speaking of. Can you screenshot the problem area from the exact page you posted?
Best regards,
Jordan Shannon

May 24, 2017 at 3:28 am #798687

ccyran
Participant

Hey Jordan,

It’s happening in the link I posted above and in any portfolio item. It happens right as you’re scrolling past the text box, while the masonry portfolio gallery fades in.

Thank you,
Chris

May 24, 2017 at 4:17 pm #798999

Jordan Shannon
Inactive Moderator

Hi,

Again, I am not seeing that in the link you posted above. I don’t see a text box on that page at all.

Best regards,
Jordan Shannon

May 24, 2017 at 4:35 pm #799017

ccyran
Participant

Hey,

You don’t see the text box on this page?

Zach Wilson

The text that says

“Zach Wilson
Cover art and creative direction for Zach Wilson’s debut album: “Fall of a man, Rise of a King”. Shot by David Hartz. More info + visuals coming soon.

Concept | Art Direction | Photography ”

Or on this page?

R/GA Stories

“R/GA Stories
Dedicated to the Naik family. In memory of one of my best friends, Ravi Naik. More info & imagery coming soon.

Art Direction | Editorial | Design”

As soon as you begin to scroll past the page, it does a bit of a hiccup. Like the entirely jumped down 30 pixels. It’s not a smooth scroll.

May 24, 2017 at 4:51 pm #799026

Jordan Shannon
Inactive Moderator

Hi,

Okay, I see the issue now. Honestly, this can be any number of issues and I would guess it is not related to css, but rather the loading of JavaScript.

Best regards,
Jordan Shannon

May 24, 2017 at 4:55 pm #799028

ccyran
Participant

Hey,

I actually think it’s related to the CSS.

When I got this CSS (below) to remove the related tags at the bottom of masonry portfolio, this jump happens.

.single portfolio .blog-tags, .single-portfolio .page-thumb, .single-portfolio .jp-relatedposts {
display: none !important;
}

Is there no way around this? A different CSS perhaps? It really bothers me that this happens on my pages. It doesn’t look good :(

May 24, 2017 at 5:03 pm #799035

ccyran
Participant

In masonry gallery, it says I can apply a unique style via CSS. maybe that can solve it?

May 25, 2017 at 1:39 am #799299

Jordan Shannon
Inactive Moderator

Hi,

If you remove the css that was put in it removes the issue correct? Please do that and I we can try a different approach.

Best regards,
Jordan Shannon

May 25, 2017 at 3:45 am #799324

ccyran
Participant

Hey Jordan,

I removed it. The issue is gone, but the “related” text on the bottom is back.

Thank you,
Chris

May 25, 2017 at 5:11 pm #799650

Jordan Shannon
Inactive Moderator

Hi,

Okay, we can see if an alternative method can both hide that area and prevent the skip. If you could please provide admin info it would be much appreciated.

Best regards,
Jordan Shannon

May 25, 2017 at 6:06 pm #799687
ccyran
Participant
Okay great!

Admin info in private content area…
- This reply was modified 7 years, 5 months ago by ccyran.
May 26, 2017 at 1:13 am #799913

Jordan Shannon
Inactive Moderator

Hi,

It seems like you are using JetPack’s feature to display related posts because once I deactivated it, it removed the related items. Please check the settings within JetPack and see if you can disable this feature.

Best regards,
Jordan Shannon

May 26, 2017 at 2:28 am #799933
ccyran
Participant
Hey Jordan,

Im confused. Did you deactivate it?

I stil see the page jumps. Like on this page for example:

Zach Wilson

And I deactivated jetpack entirely and its still happening. Can you fix this?

Thank you,
Chris
- This reply was modified 7 years, 5 months ago by ccyran.
May 26, 2017 at 5:09 am #799967
ccyran
Participant
~~Hey Jordan,~~

~~I found a solve but I think it’s only temporary. I would still like a solution to this.~~

~~What I’ve done in the meantime…~~

It only happens to pages that have a text box right above the masonry gallery. I placed a 100×100 clear box (.png file) inside the grid row and beneath the text box, and this issue doesn’t happen anymore. Im not sure why it fixed it that way, but it did.

Sorry I spoke too soon :/. I just looked at my site on a bigger screen (Macbook 15″) and the issue is still happening.

Thank you,
Chris
- This reply was modified 7 years, 5 months ago by ccyran.
May 26, 2017 at 6:00 pm #800287

Jordan Shannon
Inactive Moderator

Hi,

I added in a color section between the text and the gallery. Please test and see if the issue still occurs. It fixed it on my 15″ screen.

Best regards,
Jordan Shannon

May 26, 2017 at 6:32 pm #800303

ccyran
Participant

Hey Jordan,

That seemed to fix it! But is there any way to do 1 of these 2 two things?

1. Reduce the gap now between the text box and masonry gallery.
2. Hide a color section on mobile, since it doesn’t happen there.

Thanks!

May 26, 2017 at 6:50 pm #800311
Jordan Shannon
Inactive Moderator
Hi,

Right now the color section at that exact height prevents the jump on desktop so it may be best to keep that as is for now. It can be hidden on mobile by adding the following to quick css:
```
@media only screen and (max-width: 767px)  {
#av_section_1{
display:none!important;
}
}
```
Best regards,
Jordan Shannon
- This reply was modified 7 years, 5 months ago by Jordan Shannon.
May 26, 2017 at 6:56 pm #800315

ccyran
Participant

Ah okay got it!

And adding this CSS will remove the color sections on any page right? Since I’ll be using this method wherever the page jumps.

May 26, 2017 at 6:59 pm #800316

Jordan Shannon
Inactive Moderator

Hi,

Yes. As long as there are no additional color sections on that page. In that case just give it a unique class or id, and apply the css to that.

Best regards,
Jordan Shannon

May 26, 2017 at 7:01 pm #800318
ccyran
Participant
Awesome,

I’m not show have to give it a unique class or id haha, but I don’t think I’ll end up using color sections anyway.

Also! I just used this CSS but it seemed to remove the text on the homepage of my website. Any thoughts?
- This reply was modified 7 years, 5 months ago by ccyran.
May 26, 2017 at 7:07 pm #800322

Jordan Shannon
Inactive Moderator

Hi,

The css I gave you? If so that means you need to add a custom class to the color section I added. Please see the following:

Turn on Custom CSS Class field for all ALB Elements

Best regards,
Jordan Shannon

May 26, 2017 at 8:19 pm #800350

ccyran
Participant

Yes

And I see. So what if I give every color section on different pages the same name? It’ll apply to all right?
So I’ll only need one custom CSS. And last thing!

Could you give me an example of how to implement this? If I used “pagejump” as the custom CSS class.
I’m a bit unsure how to add that into the css you gave me.

Thanks!

May 26, 2017 at 9:03 pm #800362
Jordan Shannon
Inactive Moderator
Hi,

Yes “pagejump” would be the id of the color section.

You would then add this to quick css:
```
@media only screen and (max-width: 767px)  {
.pagejump{
display:none!important;
}
}
```
Best regards,
Jordan Shannon
May 26, 2017 at 10:31 pm #800416

ccyran
Participant

ah I see!

Dude thank you so much for all your help. I really appreciate everything.

Have a good weekend!
Chris

May 26, 2017 at 10:36 pm #800422

Jordan Shannon
Inactive Moderator

Hi,

I’m glad I can help. You have a great weekend as well!

Best regards,
Jordan Shannon

May 27, 2017 at 6:48 pm #800603
ccyran
Participant
Hey Jordan,

Sorry to bug you, I’m looking at a different page in Safari, and it’s still happening. Even with the color section. Can you check this out?

R/GA Stories

(Color section was removed here after trying it)

Thank you,
Chris
- This reply was modified 7 years, 5 months ago by ccyran.
May 29, 2017 at 5:32 am #800944

Ismael
Moderator

Hi,

I’m sorry but I can’t reproduce the “jump” issue. Could you please provide a short screencast or screenshot?

Best regards,
Ismael

May 30, 2017 at 7:13 pm #801636
ccyran
Participant
Hey Ismael,

Can you take a look again on any page?

Zach Wilson

Samsung Level U

It looks like it’s happening everywhere now. Im looking through Safari first, then Google Chrome.
- This reply was modified 7 years, 5 months ago by ccyran.
May 30, 2017 at 7:59 pm #801650

ccyran
Participant

And as an update!

Screencast: https://vimeo.com/219557271

It happens right before the masonry gallery element appears.

Notes:
Here’s what i’ve tried so far to fix this, but to no avail. Nothing works so far. Please help :(

– Disabling all CSS
– Removing related tags in “Jetpack settings”
– Removing other elements on the page (separators, the image, text boxes, etc)
– Disabling every plugin I have.
Author

Posts

Viewing 30 posts - 1 through 30 (of 41 total)

1 2 →

You must be logged in to reply to this topic.