WordPress.org

Ready to get started?Download WordPress

Forums

Events Manager
[resolved] Change the events listing style (14 posts)

  1. vibhorv
    Member
    Posted 1 year ago #

    Hi,

    Wanted to change the events listing style, i.e., similar to http://demo.wp-events-plugin.com/events/ in which all the events are well defined (separated by a line), images have rounded corners, day and date are top aligned and some more breathing space to add more content like category and tags.

    Any snippets available?

    http://wordpress.org/extend/plugins/events-manager/

  2. agelonwl
    Member
    Posted 1 year ago #

  3. vibhorv
    Member
    Posted 1 year ago #

    Hi Agelonwl,

    Thanks for the code but how to give a border-radius: 3px to the image in the below mentioned code?
    <div style="float:left; margin:0px 10px 0px 0px;">#_EVENTIMAGE{100,100}</div>

  4. vibhorv
    Member
    Posted 1 year ago #

    Also, can I get access to all the snippets used in demo site? like for custom sidebar, multiple images for events etc.

  5. Marcus
    NetWebLogic Support
    Plugin Author

    Posted 1 year ago #

    for the upcoming events widget :

    <div style="float:right; margin:0px 0px 0px 5px;">#_EVENTIMAGE{50,50}</div>#_LINKEDNAME - #_CATEGORYNAME<ul><li>#j #M #y</li><li>#_TOWN</li></ul>

  6. vibhorv
    Member
    Posted 1 year ago #

    Hey Marcus,

    can you educate further on where to use this code? also how to make the #_EVENTIMAGE have rounded corners?

    Thanks

  7. agelonwl
    Member
    Posted 1 year ago #

    for the upcoming events widget :
    you can do that in appearance > widgets > by adding events widget and putting the snippet at List item format

    rounded corners:
    you can do by by adding this snippet to your theme style.css

    img {
     border-radius: 3px;
     box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    }
  8. vibhorv
    Member
    Posted 1 year ago #

    Thanks agelonwl, will try it shortly and update you about the progress! :)

  9. vibhorv
    Member
    Posted 1 year ago #

    Thanks agelonwl, everything worked! :)

  10. agelonwl
    Member
    Posted 1 year ago #

    glad it worked.

  11. geraldinelau
    Member
    Posted 1 year ago #

    Hi, I am trying to make the same changes to the events listing style- separated by a line and the headers more aligned.

    I replaced the format with the one on Pastebin but I don't see any changes. Override with formats are turned on for both event list and event pages.

  12. Balders
    Member
    Posted 1 year ago #

    Hi there,

    I tried the rounded corner code from agelonwl.

    Problem is: The event images look nice, but the normal post images get a block spot where there should be a round corner.

    Any idea how to filter that code only for the EM images?

    Cheers
    Clemens

  13. Balders
    Member
    Posted 1 year ago #

    Sorry,

    sorted out, that was a mouse event with a bg image in black.

    Cheers

  14. agelonwl
    Member
    Posted 1 year ago #

    You can wrapped single event formats in a div at events > settings > formatting > events > default single event format
    e.g. <div class='em-content'>--formats--</div>'

    then you can do something this in your style.css

    .em-content img {
     border-radius: 3px;
     box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    }

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic