-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmalinky-gallery-shortcodes.php
154 lines (123 loc) · 6.53 KB
/
malinky-gallery-shortcodes.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<?php
add_shortcode( 'malinky-gallery-slider', 'malinky_gallery_slider' );
/**
* Output a sliding gallery that is added to a post or page with an ACF gallery field.
* Shortcode should be used in a template.
* Use flickity for slide.
*
* Shortcode Usage
*
* [malinky-gallery
* malinky_field_label = The acf field label (default malinky_gallery).
* malinky_header = Whether to display a heading. Enter the heading text.
* malinky_header_underline = Whether to add a green underline to heading. Use true.
* ]
*/
function malinky_gallery_slider( $atts )
{
global $malinky_gallery_count;
$atts = shortcode_atts(
array(
'malinky_field_label' => 'malinky_gallery',
'malinky_header' => '',
'malinky_header_underline' => false,
),
$atts,
'malinky-gallery-slider'
);
/**
* Main gallery query using ACF.
*/
$image_meta = get_field( $atts['malinky_field_label'] );
if ( ! $image_meta ) $image_meta = get_sub_field( $atts['malinky_field_label'] );
if ( ! $image_meta ) return;
$total_images = count( $image_meta );
/**
* $current_image used in a similar way to post count. Actual array keys starting at 0.
*/
foreach ( $image_meta as $current_image => $image ) {
$atts['alt_tag'] = get_the_title() . ' Photos ' . ($current_image + 1);
if ( $current_image == 0 ) { ?>
<div class="col-item col-item-full">
<?php
//Generally if not used as a flexible content block. For example an ACF field called malinky_gallery in a posttype post.
if ( $atts['malinky_header'] != '' ) { ?>
<h3<?php echo (bool) $atts['malinky_header_underline'] ? ' class="green-underline"' : ''; ?>><?php echo esc_html( $atts['malinky_header'] ); ?></h3>
<?php } ?>
<noscript><p class="box error-permanent">Please turn JavaScript on in your browser to view all photos.</p></noscript>
<div class="malinky-gallery-slider-loading"></div>
<div class="malinky-gallery-slider-wrapper" itemscope itemtype="http://schema.org/ImageGallery">
<meta itemprop="about" content="<?php echo esc_attr( get_the_title() ); ?> Photos" />
<div id="malinky-gallery-<?php echo $malinky_gallery_count; ?>" class="malinky-gallery-slider">
<?php } ?>
<div class="malinky-gallery-slider-cell" itemscope itemtype="http://schema.org/ImageObject" data-image-index="<?php echo $current_image; ?>">
<a href="<?php echo esc_url( $image['sizes']['malinky_large'] ); ?>" itemprop="contentUrl image" data-image-size-large="<?php echo esc_attr( $image['sizes']['malinky_large-width'] ); ?>x<?php echo esc_attr( $image['sizes']['malinky_large-height'] ); ?>" data-image-medium="<?php echo esc_url( $image['sizes']['malinky_medium'] ); ?>" data-image-size-medium="<?php echo esc_attr( $image['sizes']['malinky_medium-width'] ); ?>x<?php echo esc_attr( $image['sizes']['malinky_medium-height'] ); ?>" class="malinky-photoswipe-image" onclick="_gaq.push(['_trackEvent', 'malinky-gallery', 'picture', 'malinky-gallery--<?php echo strtolower( str_replace( '/', '--', str_replace( get_bloginfo('url') . '/', '', get_the_permalink() ) ) ); ?>', , true])">
<img data-flickity-lazyload="<?php echo esc_url( $image['sizes']['malinky_mini_thumbnail'] ); ?>" itemprop="thumbnail" />
</a>
</div>
<?php if ( ($current_image + 1) == $total_images ) { ?>
</div>
</div>
</div>
<?php }
}
$malinky_gallery_count++;
}
add_shortcode( 'malinky-gallery', 'malinky_gallery' );
/**
* Output a gallery that is added to a post or page with an ACF gallery field.
* Shortcode should be used in a template.
*
* Shortcode Usage
*
* [malinky-gallery
* malinky_field_label = The acf field label (default malinky_gallery).
* malinky_header = Whether to display a heading. Enter the heading text.
* malinky_header_underline = Whether to add a green underline to heading. Use true.
* ]
*/
function malinky_gallery( $atts )
{
global $malinky_gallery_count;
$atts = shortcode_atts(
array(
'malinky_field_label' => 'malinky_gallery',
'malinky_header' => '',
'malinky_header_underline' => false,
),
$atts,
'malinky-gallery-slider'
);
/**
* Main gallery query using ACF.
*/
$image_meta = get_field( $atts['malinky_field_label'] );
if ( ! $image_meta ) $image_meta = get_sub_field( $atts['malinky_field_label'] );
if ( ! $image_meta ) return;
$total_images = count( $image_meta );
/**
* $current_image used in a similar way to post count. Actual array keys starting at 0.
*/
foreach ( $image_meta as $current_image => $image ) {
$atts['alt_tag'] = get_the_title() . ' Photos ' . ($current_image + 1);
if ( $current_image == 0 ) { ?>
<div class="col-item col-item-full">
<?php
//Generally if not used as a flexible content block. For example an ACF field called malinky_gallery in a posttype post.
if ( $atts['malinky_header'] != '' ) { ?>
<h3<?php echo (bool) $atts['malinky_header_underline'] ? ' class="green-underline"' : ''; ?>><?php echo esc_html( $atts['malinky_header'] ); ?></h3>
<?php } ?>
<noscript><p class="box error-permanent">Please turn JavaScript on in your browser to view all photos.</p></noscript>
<div id="malinky-gallery-<?php echo $malinky_gallery_count; ?>" class="col malinky-gallery" itemscope itemtype="http://schema.org/ImageGallery">
<meta itemprop="about" content="<?php echo esc_attr( get_the_title() ); ?> Photos" />
<?php } ?><div class="col-item col-item-quarter col-item-third--medium col-item-half--small malinky-gallery-cell" itemscope itemtype="http://schema.org/ImageObject" data-image-index="<?php echo $current_image; ?>">
<a href="<?php echo esc_url( $image['sizes']['malinky_large'] ); ?>" itemprop="contentUrl image" data-image-size-large="<?php echo esc_attr( $image['sizes']['malinky_large-width'] ); ?>x<?php echo esc_attr( $image['sizes']['malinky_large-height'] ); ?>" data-image-medium="<?php echo esc_url( $image['sizes']['malinky_medium'] ); ?>" data-image-size-medium="<?php echo esc_attr( $image['sizes']['malinky_medium-width'] ); ?>x<?php echo esc_attr( $image['sizes']['malinky_medium-height'] ); ?>" class="malinky-photoswipe-image" onclick="_gaq.push(['_trackEvent', 'malinky-gallery', 'picture', 'malinky-gallery--<?php echo strtolower( str_replace( '/', '--', str_replace( get_bloginfo('url') . '/', '', get_the_permalink() ) ) ); ?>', , true])">
<img src="<?php echo esc_url( $image['sizes']['malinky_mini_thumbnail'] ); ?>" itemprop="thumbnail" />
</a>
</div><?php if ( ($current_image + 1) == $total_images ) { ?>
</div>
</div>
<?php }
}
$malinky_gallery_count++;
}