List Layout – move Save to Calendar button to within the Event Bar

[Matthew Bechtold]

I would like to move the “Save to your Calendar” icon to inside the event’s Time and Title section above the Event’s description. Ideally, it would appear in the lower-right-hand corner of the box for the Event, within the List Layout.

Please see the image here for a visual explanation:
https://fieldsandivy.silverthreadproductions.com/support/SupportGraphic3.jpg

Please advise. Thank you!

[room34]

Because of how the templates are structured, that kind of change isn’t really feasible within the plugin itself, although it can be achieved dynamically by making use of the jQuery .appendTo() method, firing off on the r34ics_init_end custom event as described in our Developer documentation. What you’d want would look something like below.

jQuery(function() {
	jQuery(document).on('r34ics_init_end', function() {
		jQuery('.ics-calendar-list-wrapper dd.event').each(function() {
			jQuery(this).find('button.r34ics_event_ics_download').appendTo(jQuery(this).find('.title'));
		});
	});
});

I’ve tested this code and confirmed it works. However you may find you’ll want to also add some CSS to fix the positioning of the button in its new location. (With no extra CSS, it gets inserted right up against the last word of the title.)

• This reply was modified 1 month, 2 weeks ago by room34.

[Matthew Bechtold]

I understand. Thank you for taking the time to figure that jQuery solution out. I will confer with my client to see how badly we need this change. If we do utilize it, what sort of precautions do I need to take to prevent this change from getting overwritten on update?

Regardless of whether we make this change or not, I’m impressed with your support and willingness to find a solution for me, and so quickly. Thank you, again.

Matt

[Author]

Posts