list view: is it possible to hide/limit the page content from list view?

[chrisfernie]

Link: http://dev.internaltransformation.com/calendar/

Is it possible to hide the page content info from list view? I’d like to have only the info above the two gray bar lines, nothing that is currently below them on my one example event listed. If not, is there a way to enter the page information in another field so it doesn’t show up on the list view?

NOTE: this is a site in development, so I have not ‘reverted’ to the 2011 default wordpress (listed below).

[chrisfernie]

OK – my partner solved part of it:
If you use the excerpt box in the event creation page, it will ignore the main description and only use the excerpt in the summary description.
He had to make a change in the setting / reading page.

*Now the only problem is it still puts in weird lines between the course info and description making big gaps. Can that be removed?

[snorton]

@chrisfernie, I presume your issue is specific to CSS and the attributes you’ve written for the delimiter class.
Check it out:

.delimiter {
width: 100%; <--- Here's issue number 1
margin: 20px auto;
height: 2px;
float: left; <--- issue number 2
background: url(../images/delimiter.bg.x.png) repeat-x 0 0;
}

I see that you’re using .delimiter in other locations on your site, such as in the sidebar, so if you adjust your specificity on the style then you should be able to effective eliminate the problem you’re seeing.

[snorton]

Also, FWIW, as a suggestion, instead of applying that dotted line as a background image, you could just give use h4.widget-title {bottom-border: 1px dotted #c0c0c0; padding-bottom: 1em;} in your stylesheet.

[chrisfernie]

Interesting… but to clarify, I am ‘using’ what ever the template does, so that code is automatic. I think I can work this through (thanks!) – but just to clarify, if I change this in the CSS, won’t it get overwritten by any theme updates? I’ve heard of using child-themes. What do I need to do in order to maintain the change and not have it overwritten?

thanks again!

[snorton]

Child themes are the ideal solution to effectively customizing a parent theme without fear of losing/overwriting your changes when updating the parent theme. However, in this particular situation you have a couple of options considering this is simple CSS.
First of all, you can refer to WordPress’ Child Theme Documentation to build one. It’s a really straightforward process.
However, in this case you can add the CSS directly to your Events Calendar through the Settings page found here:
[your url]/wp-admin/edit.php?post_type=tribe_events&page=tribe-events-calendar&tab=display#tribe-field-tribeEventsBeforeHTML

Add this to the “Add HTML before event content” box:

<style type="text/css">
.delimiter {
width: auto; // Fix Issue 1
margin: 20px auto;
height: 2px;
float: none; // Fix Issue 2
</style>

… and make sure you save your changes.

This will change the style applied to the delimiter class on pages with Events Calendar templates. If it doesn’t, add !important (i.e. float: none !important;) to override and fix your issue.
FYI: it’s not good practice to use !important if you can avoid it 🙂

[Brook]

Howdy chrisfernie,

That is very correct. Fortunately WordPress has a solution. Child Themes allow you to make modifications to a theme that will persist when you update the base theme. Here is the WordPress guide on how to use them: http://codex.wordpress.org/Child_Themes

Snorton provided you with a great solution (Thanks snorton!) Please let us know if it works for you. Thanks!

– Brook

[chrisfernie]

Thanks for all the info – however, I am not finding the “delimiter” class –
Whatever CSS is in the code was written by the theme, can you give me a little more direction? 🙂

Thanks!

[Brook]

If you are having trouble finding the class I generally just use Ctrl + F to search through an opened file. If you are not sure which file contains the a line of code like .delimter, any decent editor or IDE will let you search all files in a directory, commonly using Ctrl + Shift + F. But, if this is giving you trouble then snorton suggested an even easier method.

Step 1) Click on this link: http://dev.internaltransformation.com/wp-admin/edit.php?post_type=tribe_events&page=tribe-events-calendar&tab=display#tribe-field-tribeEventsBeforeHTML

Step 2) Paste the following code into the ‘Add HTML before event content’ box:

<style type="text/css">
.tribe-events-address .delimiter {
width: auto;
float: none;
background: none;
display: inline;
margin-right: .25em;
}
</style>


Step 3) Click Save Changes at the bottom.

That should fix your issue!

– Brook

[Author]

Posts