|
Tim Carlson
|
January 11, 2015 at 9:54 pm
Hi Guys,
My Thumbnails On Calendar View Do Not Fully Loading In Which Is Making Them Look Cropped. If I Reload The Page, It Fixes The Issue. Unfortunately, This Will Not Work For My Customers As They Will Not Know To Do This. It’s Very Important That I’m Able To Resolve This As Soon As Possible As The Items On The Calendar Have Vital Information At The Bottom Of Each Image. Your Assistance Is Greatly Appreciated.
|
|
Tim Carlson
|
January 11, 2015 at 9:56 pm
Here is my calendar page for you to view. You may want to do ctrl F5 when viewing the page so that there are no cached images.
http://www.wineandartparties.com/california-art-parties-calendar/
Thanks Again!
|
|
Dean
|
January 12, 2015 at 2:24 am
Hi Tim,
What version of the calendar addon are you using please?
|
|
Tim Carlson
|
January 12, 2015 at 7:23 am
Hi Dean,
Thank you for the fast response! I went with the latest Version 3.1.36.6.P version of Event Espresso & Version 2.2.4.p of Espresso Calendar. I Wasn’t sure if version 4 was stable enough yet, so I went with version 3.
|
|
Lorenzo Orlando Caum
|
January 12, 2015 at 10:52 am
Hi Tim,
Could you add this CSS via a plugin like My Custom CSS or Reaktiv CSS Builder:
#espresso_calendar .fc-event-inner {
overflow: visible;
}
#espresso_calendar .event-has-thumb {
padding-bottom: 10px;
}
Then refresh the calendar page again.
—
Lorenzo
|
|
Tim Carlson
|
January 12, 2015 at 11:16 am
Hi Lorenzo,
Do I need the plugin or can I just add it to the core files? What would be best? If I add to the core files, where do I add it? I try not to add plugins if I do not need to.
Thanks Lorenzo!
|
|
Tim Carlson
|
January 12, 2015 at 12:43 pm
OK, I inserted the code and the images all show even with Ctrl F5. The only thing it’s doing now after Ctrl F5 is the calendar grid stops where the images use to crop. The images now load in fully, but expand bast the calendar.
Thanks Again!
|
|
Lorenzo Orlando Caum
|
January 12, 2015 at 3:59 pm
Alright, could you reverse the CSS changes and then try adjusting the week mode through WP-admin –> Event Espresso –> Calendar Settings to another setting:
http://cl.ly/image/052F172m3A1k
—
Lorenzo
|
|
Tim Carlson
|
January 12, 2015 at 4:42 pm
So I’m understanding you correctly, you want me to undo the changes we did and then try a different setting on the calendar settings. Currently it’s set to liquid, what other setting do you want me to try specifically?
Thanks Lorenzo!
|
|
Lorenzo Orlando Caum
|
January 12, 2015 at 4:53 pm
Yes, that is correct. Please remove the CSS that I shared earlier and then switch to one of the other two options. Then save changes.
Next, open your calendar in a new tab and check to see if it appears correctly on the first load.
If it doesn’t, then try the remaining week mode option and re-test.
Let us know if the styling improves.
Thanks
—
Lorenzo
|
|
Tim Carlson
|
January 12, 2015 at 4:56 pm
OK, so I tried reversing the code, and also I tried deleting the code. In each scenario I also tried all variation of the calendar setting, Fixed, Liquid & Variable. Nothing worked correctly. After CTRL F5, something was either not loaded in all the way (When not using the extra css) or the images still overlapped the calendar boundaries (When using the extra css) I even tried reversing the code in the css just in case that mattered, and still no fix.
It’s almost as if the calendar when rendering is not recognizing the Stack Overflow and adjusting for the extra information?
Thanks Lorenzo!
|
|
Tony
|
January 13, 2015 at 6:12 am
Hi Tim,
The Calendar works best with portrait images with a 4 high by 3 wide ratio, your images are much taller than wide and the calendar is trying to prevent overlaps.
It appears most your images are the same proportion – 130 pixels wide by 216 pixels high
So you could apply this CSS to a plugin such as My Custom CSS or Reaktiv CSS Builder:
#espresso_calendar .thumb-wrap img {
height: 216px;
}
Which is explicitly setting the thumbnail img heigh within the Calendar elements before JS is loaded, so the Calendars JS will use the value set there to calculate the size of the event element.
If all of your images follow this same pattern this would work fine, however if you use landscape images this will not work. I have created a ticket to investigate this further.
|
|
Tim Carlson
|
January 13, 2015 at 8:56 am
Hi Tony,
I just added your CSS, but on crtl F5 (Refreshing the cache) It’s still doing the same thing. I do have Landscape paintings as well, but I just haven’t loaded them in yet so we would still need to look further into this. I just wanted to see if your solution worked at least with the Portrait paintings but no change? Your assistance is greatly appreciated! Let me know if you need to access the backend of the site if that helps.
Thanks Again!
|
|
Tim Carlson
|
January 14, 2015 at 5:43 pm
Any information on this issue? Please let me know what the status is. Thanks Guys!
|
|
Tony
|
January 15, 2015 at 6:01 am
Hi Tim,
The fix I provided works for me on a couple of test sites, I downloaded the images from your calendar and applied them to the test events so I was using the same images, however as you will also be using horizontal images that wont work.
If you create an image that is 4:3 and use that, does the same happen?
|
