css for "please log in first" and "event submitted" -

This topic has 8 replies, 2 voices, and was last updated 8 years, 9 months ago by Lou.

Viewing 8 posts - 1 through 8 (of 8 total)

Author

Posts

July 5, 2017 at 11:48 am #1316421

Participant

In reference to https://theeventscalendar.com/support/forums/topic/different-html-before-specific-views-on-view-by-view-basis/ I have the following in my theme’s style.css. The div’s with classes steeps-event-month-view and steeps-event-community-add in the Events > Settings > Display > configuration have style=”display:none;”

body.events-gridview .steeps-event-month-view {         /* display only on month view */
    display: initial !important;
}

body.tribe_community_edit .steeps-event-community-add { /* display only on community add view */
    display: initial !important;
}

I would like to have different text at the top in two cases when using the community/add form

displayed after the user submits the event form
displayed when the user hasn’t logged in yet

Currently this shows with the ‘body.tribe_community_edit .steeps-event-community-add’ selector

Is this possible? I don’t see any class to hang on to get this behavior

July 6, 2017 at 4:55 pm #1317171

Geoff B.

Member

Good evening Lou and welcome back!

Thank you for reaching out to us.
I would love to help you with this topic.

The proper way to achieve what you are looking for is through some view customization (template override). You might want to read our Themer’s guide to get a sense of how that works.

Basically, you can take any view, tweak it to your liking and place it in your WordPress theme’s /tribe-events/ folder.

Let me know how that goes.

Best regards,
Geoff B.

July 6, 2017 at 5:05 pm #1317175

Lou

Participant

I was given alternative guidance earlier about how to use css to achieve my goals.

In any case, I looked at the code in the edit-event.php file but don’t see how the login is rendered, nor how the ‘event submitted’ text is rendered.

What template(s) do these renderings originate from?

July 7, 2017 at 10:29 am #1317513

Geoff B.

Member

Good afternoon Lou,

Thank you for writing back.
I understand that my colleague suggested different ideas to you, including CSS.
However, for your specific remaining need CSS won’t help you.

Just to set expectations, the scope of our support is mostly to get our customers started on the right track and to help them in case of issues.

We unfortunately do not provide complete support for customization.

With that in mind, here are 2 ways to about what you want to do:

The login is rendered using WordPress built-in functionalities. If you want easy and complete control, I would strongly advise using https://wordpress.org/plugins/theme-my-login/
As for the text “Event Submitted”, it originates from the plugin’s language files. If you simply want to swap things out (replace the Event submitted with another string), you could use https://gist.github.com/andrasguseo/29903a974cb84060957881c17613c278
Once edited, it goes in the functions.php file of your WordPress theme..

Let me know if that helps.

Have a great day!

Geoff B.

July 8, 2017 at 2:18 pm #1318008

Lou

Participant

I was able to get the css method to work. It required using actions invoked at the start of the event add and event list functions by Main.php. I’m documenting this here in case anyone else has similar needs. Note my theme is “steeps” (https://github.com/louking/steeps) so all of the functions and classes start with steeps_

This behavior can be seen at https://sandbox.steeplechasers.org/events/community/add

functions.php – add to the bottom

/**
 * For The Events Calendar: Community Events, on the event page, check for some special conditions. This is
 * being done to control display of "before html" content
 */
if ( is_plugin_active('the-events-calendar-community-events/tribe-community-events.php') ) {
	$ce_event_class = 'steeps-ce-class-unknown';
	// adapted from Tribe__Events__Community__Main.get_submitted_event (Main.php)
	function steeps_get_submitted_event() {
		if ( empty( $_POST[ 'community-event' ] ) ) {
			return array();
		}
		if ( ! check_admin_referer( 'ecp_event_submission' ) ) {
			return array();
		}
		$submission = $_POST;
		return $submission;
	}

	// adapted from Tribe__Events__Community__Main.doEventForm (Main.php)
	// this action is invoked before community/edit processing
	function steeps_ce_determine_class_edit ( $id ) {
		global $ce_event_class;
		if ( $id ) {
			$tribe_event_id = $id = intval( $id );
		} else {
			$tribe_event_id = null;
		}
		if ( $tribe_event_id ) {
			$event = get_post( intval( $tribe_event_id ) );
		}
		// special class if logged out
		// NOTE: assumes allow anonymous submissions configured as false
		if ( ! is_user_logged_in() ) {
			$ce_event_class = 'steeps-ce-class-logged-out';
		
		// logged in
		} else {
			$submission = steeps_get_submitted_event();
			if (! empty( $submission )) {
				$ce_event_class = 'steeps-ce-class-submitted';
			} else {
				$ce_event_class = 'steeps-ce-class-empty-form';
			}
		}
	}
	add_action( 'tribe_community_before_event_page', 'steeps_ce_determine_class_edit', 11 );

	// adapted from Tribe__Events__Community__Main.doMyEvents (Main.php)
	// this action is invoked before community/list processing
	function steeps_ce_determine_class_list ( ) {
		global $ce_event_class;
		// special class if logged out
		if ( ! is_user_logged_in() ) {
			$ce_event_class = 'steeps-ce-class-logged-out';
		
		// logged in
		} else {
			$ce_event_class = 'steeps-ce-class-list';			
		}
	}
	add_action( 'tribe_ce_before_event_list_page', 'steeps_ce_determine_class_list', 11 );

	function steeps_before_html ( $string ) {
		global $ce_event_class;
		return '<div class="steeps-ce-before-html ' . $ce_event_class . '">' . $string . '</div>';
		// return '<div class=steeps-ce-before-html>' . $string . '</div>';
	}
	add_filter( 'tribe_events_before_html', 'steeps_before_html' );

	// after html is noop for now
	function steeps_after_html( $string ) {
		return $string;
	}
	add_filter( 'tribe_events_after_html', 'steeps_after_html' );
}

style.css – add to the bottom

/*
 * before html styling
 */
.tribe-events-before-html ul li {
    line-height: inherit;
    margin: 0 0 0 0;
}
.tribe-events-before-html table {
    border-collapse: collapse;
}
.tribe-events-before-html table, .tribe-events-before-html th, .tribe-events-before-html td {
    /*border: 1px solid black;*/
    padding: 3px;
}
body.tribe_community_edit .steeps-ce-class-logged-out > form#loginform {
    margin-top: 21px;
}
body.tribe_community_edit .steeps-ce-class-logged-out > .register {
    margin-bottom: 21px;
}

/* 
 * the events calendar - before html configuration 
 *   selective for month view, community events add, community events list
 *   requires steeps-event-community-xxxx class to be used in before or after html configuration
 */
body.events-gridview .steeps-event-month-view {         
    display: initial !important;        /* display only on month view */
}

body.tribe_community_edit .steeps-ce-class-logged-out .steeps-event-community-logged-out,
body.tribe_community_list .steeps-ce-class-logged-out .steeps-event-community-logged-out
{ 
    display: initial !important;        /* display when logged out ( edit and list views) */
}
body.tribe_community_edit .steeps-ce-class-logged-out > p,
body.tribe_community_list .steeps-ce-class-logged-out > p
{ 
    display: none;                      /* hide default text when logged out ( edit and list views) */
}

body.tribe_community_edit .steeps-ce-class-empty-form .steeps-event-community-add { 
    display: initial !important;        /* display only on community add empty form */
}

body.tribe_community_edit .steeps-ce-class-submitted .steeps-event-community-add-submitted { 
    display: initial !important;        /* display only on community add after submission */
}

example “before html” events display configuration (with angle brackets replaced with square brackets)

[div class="steeps-event-month-view" style="display: none;"]

To request that your event be added to the Steeplechasers Events calendar, please click on [a href="https://steeplechasers.org/events/community/add"]Add Event[/a].

To find events for which volunteers are needed, under Event Category, check Course Marking and Finish Line, and click SUBMIT. If you see a race you can help at, send email to [a href="mailto:[email protected]"][email protected][/a]. (If you don't see Event Category, try clicking 'Show Filters' first).

[/div]

[div class="steeps-event-community-add" style="display: none;"]

Race Directors should use this form to request that local running events (within 75 miles of Frederick, MD) be placed on our calendar.

Please provide the following
[table]
    [tr][th]Field[/th][th]Description[/th][/tr]
    [tr][td]EVENT TITLE[/td][td]Race Name[/td][/tr]
    [tr][td]EVENT DESCRIPTION[/td][td]Any text you'd like included in the race description, e.g., a little bit about why you're putting on this race, what it benefits, how to register -- registration URL, link to flyer, etc[/td][/tr]
    [tr][td]EVENT TIME & DATE[/td][td]Race Date and Time[/td][/tr]
    [tr][td]EVENT IMAGE[/td][td]Optionally add an image to your event[/td][/tr]
    [tr][td]VENUE DETAILS[/td][td]Race Location - please search first as the venue may already exist[/td][/tr]
    [tr][td]ORGANIZER DETAILS[/td][td]Organizer Name (required), Organizer Email (required), Organizer Phone (optional). Again please search first as the organizer may already exist[/td][/tr]
    [tr][td]EVENT WEBSITE[/td][td]Race Website - this website should give information about the race and most likely also links to registration site[/td][/tr]
[/table]
[/div]

[div class="steeps-event-community-add-submitted" style="display:none;"]
Your submission will be reviewed before publishing -- this process can take several days.

[b]Note:[/b] FSRC reserves the right to choose which races are published.
[/div]

[div class="steeps-event-community-logged-out" style="display:none;"]
You need to be logged in to edit or list events. If you have an account, please log in below, otherwise please register using the "Register" link beneath the LOG IN button.
[/div]

This reply was modified 8 years, 9 months ago by Lou. Reason: add link to example site

July 8, 2017 at 2:34 pm #1318010

Lou

Participant

Hmm, typed a rather lengthy reply on how I got this to work, but it seems to have disappeared. Maybe because I edited it twice? Tried to repost and was told it was a duplicate, so hopefully it will show up eventually.

July 9, 2017 at 8:08 am #1318113

Lou

Participant

Retrying my lengthy reply:

This behavior can be seen at https://sandbox.steeplechasers.org/events/community/add

functions.php – add to the bottom

/**
 * For The Events Calendar: Community Events, on the event page, check for some special conditions. This is
 * being done to control display of "before html" content
 */
if ( is_plugin_active('the-events-calendar-community-events/tribe-community-events.php') ) {
    $ce_event_class = 'steeps-ce-class-unknown';
    // adapted from Tribe__Events__Community__Main.get_submitted_event (Main.php)
    function steeps_get_submitted_event() {
        if ( empty( $_POST[ 'community-event' ] ) ) {
            return array();
        }
        if ( ! check_admin_referer( 'ecp_event_submission' ) ) {
            return array();
        }
        $submission = $_POST;
        return $submission;
    }

    // adapted from Tribe__Events__Community__Main.doEventForm (Main.php)
    // this action is invoked before community/edit processing
    function steeps_ce_determine_class_edit ( $id ) {
        global $ce_event_class;
        if ( $id ) {
            $tribe_event_id = $id = intval( $id );
        } else {
            $tribe_event_id = null;
        }
        if ( $tribe_event_id ) {
            $event = get_post( intval( $tribe_event_id ) );
        }
        // special class if logged out
        // NOTE: assumes allow anonymous submissions configured as false
        if ( ! is_user_logged_in() ) {
            $ce_event_class = 'steeps-ce-class-logged-out';
        
        // logged in
        } else {
            $submission = steeps_get_submitted_event();
            if (! empty( $submission )) {
                $ce_event_class = 'steeps-ce-class-submitted';
            } else {
                $ce_event_class = 'steeps-ce-class-empty-form';
            }
        }
    }
    add_action( 'tribe_community_before_event_page', 'steeps_ce_determine_class_edit', 11 );

    // adapted from Tribe__Events__Community__Main.doMyEvents (Main.php)
    // this action is invoked before community/list processing
    function steeps_ce_determine_class_list ( ) {
        global $ce_event_class;
        // special class if logged out
        if ( ! is_user_logged_in() ) {
            $ce_event_class = 'steeps-ce-class-logged-out';
        
        // logged in
        } else {
            $ce_event_class = 'steeps-ce-class-list';           
        }
    }
    add_action( 'tribe_ce_before_event_list_page', 'steeps_ce_determine_class_list', 11 );

    function steeps_before_html ( $string ) {
        global $ce_event_class;
        return '<div class="steeps-ce-before-html ' . $ce_event_class . '">' . $string . '</div>';
        // return '<div class=steeps-ce-before-html>' . $string . '</div>';
    }
    add_filter( 'tribe_events_before_html', 'steeps_before_html' );

    // after html is noop for now
    function steeps_after_html( $string ) {
        return $string;
    }
    add_filter( 'tribe_events_after_html', 'steeps_after_html' );
}

style.css – add to the bottom

/*
 * before html styling
 */
.tribe-events-before-html ul li {
    line-height: inherit;
    margin: 0 0 0 0;
}
.tribe-events-before-html table {
    border-collapse: collapse;
}
.tribe-events-before-html table, .tribe-events-before-html th, .tribe-events-before-html td {
    /*border: 1px solid black;*/
    padding: 3px;
}
body.tribe_community_edit .steeps-ce-class-logged-out > form#loginform {
    margin-top: 21px;
}
body.tribe_community_edit .steeps-ce-class-logged-out > .register {
    margin-bottom: 21px;
}

/* 
 * the events calendar - before html configuration 
 *   selective for month view, community events add, community events list
 *   requires steeps-event-community-xxxx class to be used in before or after html configuration
 */
body.events-gridview .steeps-event-month-view {         
    display: initial !important;        /* display only on month view */
}

body.tribe_community_edit .steeps-ce-class-logged-out .steeps-event-community-logged-out,
body.tribe_community_list .steeps-ce-class-logged-out .steeps-event-community-logged-out
{ 
    display: initial !important;        /* display when logged out ( edit and list views) */
}
body.tribe_community_edit .steeps-ce-class-logged-out > p,
body.tribe_community_list .steeps-ce-class-logged-out > p
{ 
    display: none;                      /* hide default text when logged out ( edit and list views) */
}

body.tribe_community_edit .steeps-ce-class-empty-form .steeps-event-community-add { 
    display: initial !important;        /* display only on community add empty form */
}

body.tribe_community_edit .steeps-ce-class-submitted .steeps-event-community-add-submitted { 
    display: initial !important;        /* display only on community add after submission */
}

example “before html” events display configuration (with angle brackets replaced with square brackets)

[div class="steeps-event-month-view" style="display: none;"]

To request that your event be added to the Steeplechasers Events calendar, please click on [a href="https://steeplechasers.org/events/community/add"]Add Event[/a].

To find events for which volunteers are needed, under Event Category, check Course Marking and Finish Line, and click SUBMIT. If you see a race you can help at, send email to [a href="mailto:[email protected]"][email protected][/a]. (If you don't see Event Category, try clicking 'Show Filters' first).

[/div]

[div class="steeps-event-community-add" style="display: none;"]

Race Directors should use this form to request that local running events (within 75 miles of Frederick, MD) be placed on our calendar.

Please provide the following
[table]
    [tr][th]Field[/th][th]Description[/th][/tr]
    [tr][td]EVENT TITLE[/td][td]Race Name[/td][/tr]
    [tr][td]EVENT DESCRIPTION[/td][td]Any text you'd like included in the race description, e.g., a little bit about why you're putting on this race, what it benefits, how to register -- registration URL, link to flyer, etc[/td][/tr]
    [tr][td]EVENT TIME & DATE[/td][td]Race Date and Time[/td][/tr]
    [tr][td]EVENT IMAGE[/td][td]Optionally add an image to your event[/td][/tr]
    [tr][td]VENUE DETAILS[/td][td]Race Location - please search first as the venue may already exist[/td][/tr]
    [tr][td]ORGANIZER DETAILS[/td][td]Organizer Name (required), Organizer Email (required), Organizer Phone (optional). Again please search first as the organizer may already exist[/td][/tr]
    [tr][td]EVENT WEBSITE[/td][td]Race Website - this website should give information about the race and most likely also links to registration site[/td][/tr]
[/table]
[/div]

[div class="steeps-event-community-add-submitted" style="display:none;"]
Your submission will be reviewed before publishing -- this process can take several days.

[b]Note:[/b] FSRC reserves the right to choose which races are published.
[/div]

[div class="steeps-event-community-logged-out" style="display:none;"]
You need to be logged in to edit or list events. If you have an account, please log in below, otherwise please register using the "Register" link beneath the LOG IN button.
[/div]

July 10, 2017 at 8:43 pm #1319308

Geoff B.

Member

Good evening Lou,

I am super impressed and stoked that you achieved just what you were looking for!

Thank you for sharing for others out there.

You are welcome back in our support forums any time 🙂

For now, I am going to close this thread.

Have a great week!

Geoff B.

Author

Posts

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘css for "please log in first" and "event submitted"’ is closed to new replies.