b2dd3eec by Jeff Balicki

remove quotes

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 321ec4aa
1 <?php
2
3 /**
4 * Quotes Block Template.
5 *
6 * @param array $block The block settings and attributes.
7 * @param string $content The block inner HTML (empty).
8 * @param bool $is_preview True during AJAX preview.
9 * @param (int|string) $post_id The post ID this block is saved to.
10 */
11
12 // Create id attribute allowing for custom "anchor" value.
13 $id = 'slider-' . $block['id'];
14 if( !empty($block['anchor']) ) {
15 $id = $block['anchor'];
16 }
17
18 // Create class attribute allowing for custom "className" and "align" values.
19 $className = 'slider';
20 if( !empty($block['className']) ) {
21 $className .= ' ' . $block['className'];
22 }
23 if( !empty($block['align']) ) {
24 $className .= ' align' . $block['align'];
25 }
26 if( $is_preview ) {
27 $className .= ' is-admin';
28 }
29
30 ?>
31 <div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?> quotes same-height">
32
33 <h3>SOME OF OUR BEST QUOTES:</h3>
34 <?php if( have_rows('quote') ): ?>
35 <ul class="slides">
36 <?php while( have_rows('quote') ): the_row();
37 $image = get_sub_field('image');
38 ?>
39 <li class="container quote">
40 <div class="row">
41 <div class="col col-sm-4">
42 <img class="quote_image" src="<?php echo $image['url'];?>" />
43 </div>
44 <div class="col col-sm-8"><p><?php the_sub_field('text'); ?></p></div>
45 </div>
46 </li>
47 <?php endwhile; ?>
48 </ul>
49
50 <?php else: ?>
51 <p>Please add some slides.</p>
52 <?php endif; ?>
53 </div>
54
1 (function($){
2
3 /**
4 * initializeBlock
5 *
6 * Adds custom JavaScript to the block HTML.
7 *
8 * @date 15/4/19
9 * @since 1.0.0
10 *
11 * @param object $block The block jQuery element.
12 * @param object attributes The block attributes (only available when editing).
13 * @return void
14 */
15 var initializeBlock = function( $block ) {
16 $block.find('.slides').slick({
17 dots: false,
18 infinite: true,
19 speed: 300,
20 slidesToShow: 1,
21 autoplay: true,
22 autoplaySpeed: 4000,
23 adaptiveHeight: false,
24 arrows:true
25 });
26 }
27
28 // Initialize each block on page load (front end).
29 $(document).ready(function(){
30 $('.slider').each(function(){
31 initializeBlock( $(this) );
32 });
33 });
34
35 // Initialize dynamic block preview (editor).
36 if( window.acf ) {
37 window.acf.addAction( 'render_block_preview/type=quote', initializeBlock );
38 }
39
40 })(jQuery);
...\ No newline at end of file ...\ No newline at end of file
1 .quotes{
2 background-color:#D6EAF9;
3 padding: 30px 50px;
4 }
5
6 @media (max-width: 768px){
7 .quotes{
8 padding: 20px 20%;
9 margin: -5%;
10 }
11 }
12
13
14 .quotes .slides{
15 list-style: none;
16 margin-block-start: 0em;
17 margin-block-end: 0em;
18 margin-inline-start: 0px;
19 margin-inline-end: 0px;
20 padding-inline-start: 0px;
21 }
22 .container.quote{
23 width: 100%;
24 }
25 .container.quote .row {
26 margin-right: -15px !important;
27 margin-left: -15px !important;
28 }
29 .container.quote p{
30 font-size: 16px !important;
31 line-height:21px !important;
32 font-style: italic;
33 }
34 .quotes h3{
35 font-size: 25px !important;
36 line-height:25px !important;
37 text-align:left;
38 margin-left: 3% !important;
39 }
40 @media (max-width: 768px){
41 .quotes h3{
42 text-align:center;
43 margin-bottom: -20px;
44 margin-left: 0% !important;
45 }
46 }
47 .quote_image{
48 width: 100%;
49
50 }
51 .no-padding{
52 padding-top: 0rem;
53 padding-bottom: 0rem;
54 }
55
56
57 .slick-next{
58 right: -25px;
59 z-index: 9999;
60 top: 30%;
61 }
62 .slick-prev {
63 left: -30px;
64 z-index: 9999;
65 top: 30%;
66 }
67
68 @media (max-width: 768px){
69 .slick-next{
70 right: -55px;
71 z-index: 9999;
72 top: 30%;
73 }
74 .slick-prev {
75 left: -55px;
76 z-index: 9999;
77 top: 30%;
78 }
79
80
81 }
82 .slick-next:before{
83
84 content: " ";
85 background-image: url(next-arrow.png);
86 background-size: contain;
87 width: 50px !important;
88 height: 50px !important;
89 display: block;
90 background-repeat: no-repeat;
91 }
92 .slick-prev:before{
93
94 content: " ";
95 background-image: url(previous-arrow.png);
96 background-size: contain;
97 width: 50px !important;
98 height: 50px !important;
99 display: block;
100 background-repeat: no-repeat;
101 }
...\ No newline at end of file ...\ No newline at end of file