Pop-up text on image click WordPress - wordpress

I am designing a wordpress site for a friend. He wants the bio text to appear after clicking on necessary image. I noticed this is straight forward with Elementor Pro. I want to keep things free for him at the mo.
I am running the Astra theme with basic Elementor. I also know how to code so if you think this is a custom css job then let me know the work around. (I'm brand new to WP)
Many thanks

Try adding an onclick event to the image and write some java script to add text where you want or may be enable a hidden textarea ??
You can check this link below for reference
How do I add a .click() event to an image?

Related

Cannot change button text

The site is build with wordpress and using the favetheme,houzes theme for real estate theme site, and what seems to be the problem here i cannot change this button text [Load more] so what i need is to know where can i edit the button text.
Thank you
i've tried elementor but its not showing the button i think its attached to the section which is for showing featured properites, i tried with edit page and the customize but i still couldn't change the text or the button it's self.
I changed it on back-end accessing cpanel, it was at shortcodes of houzes theme you can find, at property-cards-v5.php (you can check its name in elementor by trying to edit it) changed its content of Load More, it was attached to the section it was part of the slide show

Elementor change section image on button hover on column

I am new to elemetor and just wanted to explore the plugin. I have seen the website of Hongkong University and there is a part there where if a user hovers over the text, the background image would change. The change depends on the text being hovered. I wanted to recreate this under elementor but can't figure how.
I tried adding a custom id to the section and button (via elementor), then adding custom CSS codes in WordPress. Unfortunately, I was unsuccessful. If this is not possible using elementor, may I know if there is a plugin that has the same function? Thank you.
I have checked the website you have mentioned above. You can make it using Elementor and some custom coding. Please check this video tutorial which will help you to understand how you can make the same as per your requirement. You need to just change it as background image and hover on text selector.
You can also check this tutorial to get another idea. Code snippets are also added there

Not able to edit texts in WordPress Widget

In my WordPress website from recently I am unable to edit any text in the widgets. Once I drag and drop a text widget it loads and just gets saved without allowing me to add any texts. Even the existing widgets are also disabled to edit.
Please help to sort out this issue as I need to add more additional information to the website.
I have attached an image of the issue:
Please check your developer console in browser. I believe that there is some Javascript error in back end.
Try to deactivate all plugins & switch to a default theme. Then activate plugins one by one.

Get the Default Wordpress Slideshow to work with Shadowbox.js?

I am using the nivo slideshow included with Wordpress.
I put a video into the slideshow rotation, but it's using shadowbox or lightbox. It's an anchor tag, which links to the video. When clicked on, the video should load in a shadowbox pop-up, but I can't get it to work. I know you're supposed to put a "rel="shadowbox" in the img, but I don't know where to put that code.
I could also use the lightbox plugin, which I have, but it';s also not working.
Any thoughts? The website is bearcomservices.com.
This is for a client.
The image is of the WP admin bar. The "Slideshow" is what we're using. It lists in the page source as "Nivo". Not quite sure where it's from.
I also have ftp access, but I don't even know where to begin looking to edit anything to make this work. I've used ftp before, and I've used Wordpress, but never both...
Have u tried ShadowJS Plugin for wordpress??

Add CSS styles to WordPress Editor

I'm currently using the TinyMCE Styleselect menu to add CSS classes into the WordPress editor. This has worked OK for me so far and is great if you only have a few classes that you want to use. When I have added more classes however, the styleselect dropdown becomes a little un-user friendly as you have to scroll through the options which can also make the page scroll also.
The solution I want to implement involves a button in the tinymce toolbar that when clicked will open a popup window, from which you can select a class to apply to the selected text in the editor.
I know how to add custom buttons to tinymce and create the popup window but how do I make the buttons that add the class actually apply the class to the the selection?
Anybody any ideas of the code I need to use to do this or a tutorial detailing the above would be great.
I am not entirely certain this is correct, but I think that if you want to go beyond customizing TinyMCE via the hooks provided by WordPress you will have to go through TinyMCE itself. Consequently this is probably more of a TinyMCE question, than it is a WordPress question. I suggest you check out the TinyMCE plugin documentation.
However, once you have your plugin ready there might be a bit of an issue getting WordPress to load it. I'd definitely try to avoid manually placing it inside wp-includes like the rest of TinyMCE, but it seems WordPress does actually provide a way of loading external plugins.

Resources