[Gelöst] Date operations and accordions

[Author]

Artikel

[Kasper Dolczewski]

I am tryingo to present list of content items as accordions with title date day by day starting from day field i have as a custom field . I this possible to do some operations on date like + one day or minus 1 day ?

is it possible to show content not as a standard list but as accordions maybe using some visual composer accordion ?

[Christian Cox]

I this possible to do some operations on date like + one day or minus 1 day ?
Sorry I do not understand . Can you please give me more details about what you would like to accomplish? A picture would be very helpful for me.
- What content items will be displayed - is it a list of posts, or custom posts, or taxonomy terms, or something else?
- What will be the title of each accordion header?
- How do the contents change day by day?

is it possible to show content not as a standard list but as accordions
Sure, there are several ways to accomplish this. If you are using Layouts, then you may use the Accordion cell as described here:
https://toolset.com/documentation/user-guides/accordion-cell/

If you are not using Layouts, then you can use Visual Composer to create your Accordion tabs and panel. Then create a View that is filtered by date to show the appropriate posts to show in each panel. Place this View in one of your Accordion panels using the [wpv-post-body] shortcode.

Filter by date:
https://toolset.com/documentation/user-guides/filtering-views-query-by-date/

Shortcode [wpv-post-body]:
https://toolset.com/documentation/user-guides/views-shortcodes/#wpv-post-body

If you can tell me some more details, I'll be glad to give you more advice. Thanks!

[Kasper Dolczewski]

I have diet posttype which is parent to hamornogram
I have dietday postype which is also parent to hamornogram

In diet i have start and end day:)

in view i create i list using connector chosen dietdays and those days i want to show as accordions. you can see the view loop in screenshot. Firstly i would be happy to create accordions with post titles. is this possible to use in this editor visual composer in view loop?

Second thing i think i need to create some shortcode i want to make accordions titles with dates instead of post titles of a child sarting from start date:) thats why i think i will need some shortcode to return me date +1

[Christian Cox]

There's not a good way to do this in the Visual Composer "Backend Editor", where you visually build rows and grid elements. However, you can switch to Visual Composer "Classic Mode" to see the shortcodes that are created for an accordion element. Visual Composer uses these shortcodes to create Accordions. See the screenshot 'classic-mode.png'. Here is a simple example:

[vc_tta_accordion]
[vc_tta_section title="Section 1 title" tab_id="1497886210146-7fd65bb9-97ad"][vc_column_text]I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.[/vc_column_text][/vc_tta_section]
[vc_tta_section title="Section 2" tab_id="1497886210183-e7f2daaf-d98e"][vc_column_text]I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.[/vc_column_text][/vc_tta_section][/vc_tta_accordion]

We can use Views to build this same structure by looping over posts. The title of each post can be used for the section title. The tab id should be a unique, valid HTML attribute, so I have used a string and the post's ID. Your View's Loop Output editor will look something like this:

[wpv-layout-start]
	[wpv-items-found]
	[vc_tta_accordion]
	<!-- wpv-loop-start -->
	<wpv-loop>
        [vc_tta_section title="[wpv-post-title]" tab_id="wpv-vc-tab-[wpv-post-id]"][vc_column_text][wpv-post-body][/vc_column_text][/vc_tta_section]
        </wpv-loop>
	<!-- wpv-loop-end -->
        [/vc_tta_accordion]
	[/wpv-items-found]
	[wpv-no-items-found]
		<strong>[wpml-string context="wpv-views"]No items found[/wpml-string]</strong>
	[/wpv-no-items-found]
[wpv-layout-end]

Then place this View in a Post, Page, or Content Template using the [wpv-post-body] shortcode.

If you want a shortcode that shows today, today + 1, etc, add this to functions.php:

add_shortcode( 'displaydate', 'displaydate_func');
function displaydate_func($atts){
    $increment = $atts['increment'];
    $day = mktime(0, 0, 0, date("m")  , date("d")+$increment, date("Y"));
    return date('l', $day); // output the day of the week, using $increment to output future days
}

Then use the shortcode like this:

[displaydate]
[displaydate increment="1"]
[displaydate increment="2"]

This will output "Monday Tuesday Wednesday". Is this what you're looking for?

[Kasper Dolczewski]

And if i would like to pass a custom field with date and then increment?

[Christian Cox]

You'll need to make a few changes to pass a custom field value.

add_shortcode( 'displaydate', 'displaydate_func');
function displaydate_func($atts){
    $increment = $atts['increment'];
    $start = $atts['start'];
    $m = date("m", $start);
    $d = date("d", $start);
    $Y = date("Y", $start);
    $day = mktime(0, 0, 0, $m, $d + $increment, $Y);
    return date('l', $day);
}

Use the shortcode in your View's Loop like this:

[displaydate increment="1" start="[types field='startdate' output='raw'][/types]"]

Increment will work the same way, but now you will pass a value for "start". Replace 'startdate' with the slug of your custom field. If you need to specify a different post id, you can add the "id" attribute to the types field shortcode.