Docs

[tewibowo]

Hi there,

i tried to apply skin to the grid plugin
it doesn’t work (only works on the grid preview),
it looks like the X customize css or X Jquery conflict with the grid css or jquery plugin.

would you mind to take a look? thank you

[tewibowo]

This reply has been marked as private.

[Lely]

Hi There,

Wordpress login is asking Authentication code. Please provide that information and the link where the grid is added.

[tewibowo]

Hi There

i deactivated the authentication security,
the grid is in the homepage. on our portfolio section below.

thank you

[Lely]

Hello There,

I did check and compare the grid from admin and frontend. I can see you have selected Portfolio skin. You’ve got Post title and category from that skins which is exactly what you get on the frontend. See this:http://screencast-o-matic.com/watch/cbe1Qu6up0. Would you mind clarifying the issue?

[tewibowo]

Hi There

that skin is not what you get on the fronted. (yes i’ve got the post title and category)
but the hover animation effect in and out doesn’t right.
also the overlay color doesn’t work.

please check the skin preview with the preview button in the grid. (that’s the exactly skin supposed to)
thank you

[Lely]

Hi There,

Thank you for the clarification.
I can see the issue now. There’s a JS error coming from Revslider:

Uncaught TypeError: Cannot read property 'progress' of undefined
    at containerResized (jquery.themepunch.revolution.min.js:8)
    at HTMLDivElement.<anonymous> (jquery.themepunch.revolution.min.js:7)
    at Function.each (jquery.js:2)
    at a.fn.init.each (jquery.js:2)
    at a.fn.init.revredraw (jquery.themepunch.revolution.min.js:7)
    at Object.target (jquery.themepunch.revolution.min.js:8)
    at Object.g._callback (jquery.themepunch.tools.min.js:60)
    at Object.g.render (jquery.themepunch.tools.min.js:60)
    at Object.g.render (jquery.themepunch.tools.min.js:60)
    at Object.C._updateRoot.F.render (jquery.themepunch.tools.min.js:60)

Please try this:

1. In the Slider Settings -> Troubleshooting set option: <b>Put JS Includes To Body</b> option to true.

[tewibowo]

hi there,

the problem still exist..
i’m also set the troubleshooting set option to jquery no conflict mode
but there still problem with the grid skin

looking forward to the solution
thank you

[Lely]

Hi There,

There is some missing CSS when I checked.
Try adding this CSS on Appearance > Customize > Custom > Edit Global CSS:

.tg-portfolio .tg-item-overlay {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 400ms ease !important;
    -moz-transition: all 400ms ease !important;
    -ms-transition: all 400ms ease !important;
    transition: all 400ms ease !important;
}
.tg-portfolio:not(.tg-force-play):not(.tg-is-playing):hover .tg-item-overlay {
    opacity: 1;
    visibility: visible;
}
.tg-portfolio .tg-item-media-holder:hover .tg-item-overlay {
    background-color: #1e3066;
}

Hope this helps.

[tewibowo]

Hi there

thank you so much
much better now with the overlay is working.

but the title and category still visible,
how to make it only visible when the item hovered?
thank you

[tewibowo]

hi there,

i fix this issue. thank you for your support!
great job!

[Christopher]

You’re welcome.

[Author]

Posts