[Katie]

I am trying to edit the widget columns on the presentation page so that the image is the link rather than the widget title. I don’t want the widget titles to appear (already figured out how to do that) but when I get rid of them the links no longer work.

My experience and knowledge with coding is limited, but can anyone tell me what to do so that the image is the link and not the widget title?

[Allie]

It’s not particularly elegant, or the best solution, but it might work it you add the code below to your custom css:

.column-image-inside { 
opacity: 0;
filter:alpha(opacity=0); /* For IE8 and earlier */;
}

.columnmore a { 
-moz-border-radius:0px;
-webkit-border-radius:0px;
border-radius:0px;
opacity: 0;
filter:alpha(opacity=0); /* For IE8 and earlier */
padding:130px 250px;
} 

[Allie]

Also make sure you keep some word in the “Read more text:” option in the Presentation Page settings. It won’t work without it.

Also, just remove the title from the Presentation Page Columns Cryout Column widget if you don’t want the title to show up.

It’s kind of a clunky solution… but oh well.

[Allie]

Sorry, just tested it. It doesn’t work with responsive site, or well on mobile devices. Basically the css styling is trying to make the “read more” button as large as the Column image, but makes it transparent so it appears the image is the link.
I told you… it’s not a great solution!
But if you insist on trying it, perhaps padding could be percentages to adapt to responsiveness? So css would look something like this?

.columnmore a { opacity: 0;
filter:alpha(opacity=0); /* For IE8 and earlier */
padding-left: 80%;
padding-right: 80%;
padding-top:60%;
padding-bottom:0px;

.column-image-inside { opacity: 0; filter:alpha(opacity=0); /* For IE8 and earlier */; }

I dunno. There’s probably a better way. maybe request it be an option?

[Mike]

I have also been trying to find a sustainable solution for this that will survive the client updating the theme. So far the most elegant solution I have found is to modify the widgets.php file to place the link around the image and the overlay that animates on hover. However, this will be undone as soon as the theme is updated and you will have to go in and modify the widgets.php file again.

I am not able to find a solution for creating a widgets.php file in the child theme folder.

Can we get some help from Zed or another DM on this?

[Pascal]

Thank’s a lot for your theme ! Excellent !
But Exactly the same problem for me, so if anyone can help us, it would be great !
Thank’s a lot !
Pascal

[Mike Heple]

So I managed to find some helpful information that lead me to a sustainable solution. I am not sure how it compares to WP best practices for child themes but it seems to work so far.

Here are the steps I followed:
1. Copy and paste the function responsible for the cryout column (in widgets.php on tempera theme) into your functions.php on your child theme. For Tempera it appears to actually a class called ColumnsWidget.

2. Modify the class/function so that the link tags are around the elements you want to be linked. in my case I did the image, the text and the slide-over affect. Also, from what I read you should rename the function so it does not conflict with the default function.

3. This is the part I was missing previously. You now need to unhook the class/function, that was creating these columns, from the hook that it is in and replace it with your new class/function.

eg:

// Remove the default ColumnsWidget function
function remove_tempera_actions() {
remove_action(‘widgets_init’, ‘ColumnsWidget’);
}
// Call ‘remove_tempera_actions’ (above) during WP initialization
add_action(‘after_setup_theme’,’remove_tempera_actions’);

// Add the new ColumnsWidgetChild function to the hook
add_action( ‘widgets_init’, create_function(”, ‘return register_widget(“ColumnsWidgetChild”);’) );

4. Save functions.php and check your presentation page to confirm changes.

Please note, I did this with the Tempera theme so some function names and hook names might be different with different themes. It depends on if Cryout uses the same names in different themes.

I hope this helps.

[Author]

Posts