Forums - Print Thread - Change CSS on Add EVent Button

Forums
» List all forums
» » Forum: Webmaster's Corner
» » » Thread: Change CSS on Add EVent Button

Print at Jan 21, 2025, 4:20:04 AM

Posted by MonchaTest at Mar 15, 2020, 8:06:53 PM

Change CSS on Add EVent Button
Were planning on using the schedule module but would like to change the button to both not show on the "list view" and match the CSS used on the site for other locations.

There's no mention of the CSS hooks for that particular button, can I override it?

Thanks in advance

Posted by support at Mar 20, 2020, 8:50:52 PM

Re: Change CSS on Add EVent Button
To clarify, you do want the Add Event button shown on certain views, but not others (like the list view)?
And you also want to be able to use CSS to alter the appearance of the button?
----------------------------------------
Marc Higgins
Support Associate, localendar.com
Follow us on Twitter! http://www.twitter.com/localendar_news

Posted by MonchaTest at Apr 2, 2020, 9:13:32 PM

Re: Change CSS on Add EVent Button
That would be correct.

Posted by support at Apr 5, 2020, 11:58:39 PM

Re: Change CSS on Add EVent Button
You can paste some javascript/jquery on your calendar footer to accomplish this (under Options->General)

For example, if you paste this, it will only hide the Add Event on the month list view:

<script>$( document ).ready(function() {$('.view_style_M1 #add_event').hide();});</script>

But let's say to want to hide it everywhere except the month view. You could use this:

<script>$( document ).ready(function() {$('#add_event').hide();$('.view_style_M0 #add_event').show();});</script>

The button has the id "add_event", so you can style it with that hook using the CSS on your page, or again with a little script. Here's come code that only shows it on the M0 view, and also changes the color to red

<script>$( document ).ready(function() {$('#add_event').hide().css("background-color","red");$('.view_style_M0 #add_event').show();});</script>

I hope that gets you started! Let me know if you have further questions.
----------------------------------------
Marc Higgins
Support Associate, localendar.com
Follow us on Twitter! http://www.twitter.com/localendar_news

Posted by MonchaTest at Apr 7, 2020, 5:51:17 PM

Re: Change CSS on Add EVent Button
Awesome! Thank you very much!

Posted by Beulahland at Apr 9, 2020, 3:45:30 PM

Re: Change CSS on Add EVent Button
My attempts at using the code provided failed. I've put the code(s) in the footer but have not seen any changes.

Now the only thing I have in my footer is - <style>.mj-usr{display:none;}</style> (This still works)

Thanks for the help

Posted by Beulahland at Apr 14, 2020, 2:47:29 PM

Re: Change CSS on Add EVent Button
*bump*

My attempts at using the code provided failed. I've put the code(s) in the footer but have not seen any changes.

Now the only thing I have in my footer is - <style>.mj-usr{display:none;}</style> (This still works)

Thanks for the help

Posted by support at Apr 15, 2020, 8:53:48 PM

Re: Change CSS on Add EVent Button
You had the "Allow Visitors to Add Calendar Events" feature turned off under Options->General. I have turned it on. Otherwise, the Add Event button will never be shown (no matter what)

Now, with the full code set on your Footer(which was already there when I checked) the button is only shown on the M0 view. It is hidden on the day and week views for example.

You might also want to clear your browser cache just to make sure you aren't seeing an old version of the page.

Please let me know if that doesn't get things working correctly :)
----------------------------------------
Marc Higgins
Support Associate, localendar.com
Follow us on Twitter! http://www.twitter.com/localendar_news

Posted by Beulahland at Apr 16, 2020, 5:22:14 PM

Re: Change CSS on Add EVent Button
Thank you for the response.

I see that the code works in the server side views but, does the opposite on the embedded side views. The embedded month view hides the button and shows it in the embedded list view.

Posted by support at Apr 23, 2020, 7:06:11 PM

Re: Change CSS on Add EVent Button
If you can send me links to the pages where you're using embedded views, I'd be happy to take a look.
----------------------------------------
Marc Higgins
Support Associate, localendar.com
Follow us on Twitter! http://www.twitter.com/localendar_news