How to add image to specific events, jquery full calendar

问题

I have wp custom post type, and have custom taxonomy, there is one extra field in it which is icon that represents of the taxonomy.

So I can query from wpdb and pass all th necessry stuffs to jquery full calendar using json.

But cant display image src through feed as currently it doesnt have imgage field. Currrenlt it has title, url, start_date, end_date and few others but it lacks image.

My requirement is: each event falls to specific category, and each category has its own image/icon, so rather than displaying evnent title on calendar, i just want to display its category's image

I was wonderirng if it like as follows:

$jsonevents[] = array(
            'title' => $new_term,
            'image'=> $img_var,
            'start'  => $stime,
            'textColor' => '#757770',
            'backgroundColor' =>'#e8e8e8'
           );

I know there is no image key in jquery full calendar but i think we may need to modify fullcalendar.js file.

So question is is there anyone who already modified this?

回答1:

I answered something similar a while back - I think it applies here too:

full calendar - associate clickable icons with events?

Take a look and let me know if it helps!

回答2:

I also answered something similar not too long ago:

jquery-fullcalendar-plugin-with-check-box

In that answer, I gave two possible options. Checkout option 1, where I show how you can add a background image to the fullcalendar events just using css and the already available "className" field on the fullcalendar event object. I'm using that method successfully in a production website to add little icons to certain kinds of events.

My option 2 is basically the same as proposed by ganeshk -- using the eventRender callback.

回答3:

The json file can contain an imageurl entry.

In fullcalendar.js (lines 6268 and 5054), I have added this code:

var imageurl = "";
if (event.imageurl) {
    imageurl = '<img src="'+event.imageurl+'" width="20"/>';
}

line 6295 :

htmlEscape(event.title) + imageurl +

line 5059 :

titleHtml =
            '<span class="fc-title">' +
                (htmlEscape(event.title || '') || '&nbsp;') + // we always want one line of height
                imageurl +
            '</span>';

来源：https://stackoverflow.com/questions/11961709/how-to-add-image-to-specific-events-jquery-full-calendar

标签

fullcalendar