Docs

[bteague28]

This thread was closed, so I had to open a new one.

https://community.theme.co/forums/topic/video-lock-plugin-close-button-not-working/

I added this code, but the close button is not visible.

.x-video-lock-close {
width: 28px;
height: 28px;
font-size: 28px;
color: rgba(255,255,255,0.8);
}

I am running the following versions:

Theme X: 4.0.3
Video Lock: 1.0.0
Shortcodes: 3.0.5
Revolution Slider: 4.6.5
WordPress: 4.0.13

Cornerstone is not installed, but everything else is working just fine.

How can we get this working?

Thanks!

[Rupok]

Hi there,

It seems you are using very older version of X with X Shortcodes. So the extensions might not work as expected. X Shortcodes has been replaced by Cornerstone long ago and you should keep everything up to date.

You can find the latest version numbers here: (http://theme.co/changelog/) Then you can compare them to what’s installed on your site.

If you find anything to be out of date, you can review our update guide.

[bteague28]

Can you offer any other suggestions? Do a major upgrade like this, just to fix one small issue, is not smart. I just updated the Video Lock plugin to Version 1.1.1. It’s still not working.

Is there a way to manually add the button using code?

How is it supposed to work? Can you post a screen shot showing what it looks like?

Thanks!

[bteague28]

OK, the close button is being rendered on the page and it works. It’s located in the top left-hand corner of the page, but you just can’t see it. I was able to find it by inspecting the page.

I was able to change the background to blue (see attached image). I can now see where the button is supposed to be.

.x-video-lock-close {
width: 50px;
height: 50px;
font-size: 48px;
background-color: blue;
}

It looks like the problem is here. The icon is set to 0 by 0 or it is missing.

i.x-icon.x-icon-close {
}

Can you give me some CSS code that will expose the button so people can see it?

Thanks!

[Nabeel A]

Hi again,

Can you please provide the URL of your site so we can take a look? For a permanent solution you should update your X theme to the latest version and install Cornerstone plugin. X – Shortcodes is replaced with Cornerstone which inherits all the functionality of X Shortcodes which means X Shortcodes can be safely deactivated and deleted. You can create a test environment and run the update or you can take a backup first and then update everything.

Installing Cornerstone is must to make sure everything works as expected.

Hope this helps!

[bteague28]

This reply has been marked as private.

[bteague28]

By the way, you have the same problem on all your demos.

Example 1

Example 2

Example 3

Example 4

Example 5

If I pull my laptop screen forward, I can see the tiny x in the upper left-hand corner of the screen. If I right click in that area, I can inspect the elements.

You’re welcome! How do we fix this?

[Nabeel A]

Hi there,

Thank you for pointing this out. The close button position is intentional we just need to change the color of the button so it is more prominent. I’ve forwarded this to our development team and they’ll take care of this in future release. For now you can fix this by adding the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

.x-video-lock-close {
    top: 10px !important;
    left: auto !important;
    color: #fff !important;
    right: 10px !important;
    background: transparent !important;
}

Don’t forget to clear your browser’s cache after adding the code. Let us know how this goes!

[bteague28]

Thanks for that! How do I make the X bigger?

[Nabeel A]

Hi again,

To make the X bigger, replace the previous code with this:

.x-video-lock-close {
    top: 10px !important;
    left: auto !important;
    color: #fff !important;
    right: 30px !important;
    background: transparent !important;
    font-size: 40px !important
}

Adjust the font-size in the above code to make the icon bigger or smaller.

Cheers!

[bteague28]

That worked! Thanks ever so much.

[Prasant Rai]

You are most welcome. 🙂

[Author]

Posts