'; $output .= ''; $output .= ''; $output .= ''; return $output; } /** * Get Instagram token. * * @access public * @since 3.8 * @return string Instagram token. */ public function get_token() { // We already have retrieved a token, continue to use it. if ( null !== $this->token ) { return $this->token; } $this->token = get_option( 'fusion_instagram_token' ); // No tokens. if ( ! $this->token ) { $this->token = false; } // Return what we have. return $this->token; } /** * Enqueue script for handling OAuth. * * @since 3.8 * @access public * @return void */ public function enqueue_api_script() { wp_enqueue_script( 'fusion_instagram_oauth', FUSION_BUILDER_PLUGIN_URL . 'assets/admin/js/fusion-instagram-oauth.js', [], FUSION_BUILDER_VERSION, true ); wp_localize_script( 'fusion_instagram_oauth', 'fusionInstagramOAuth', [ 'status' => $this->localize_status, ] ); } /** * Authenticate. * * @access public * @since 3.8 */ public function authenticate() { $token = []; // phpcs:disable WordPress.Security.NonceVerification if ( ! isset( $_GET['token'] ) ) { $this->localize_status = 'error'; } if ( isset( $_GET['token'] ) ) { $token['token'] = sanitize_text_field( wp_unslash( $_GET['token'] ) ); $this->localize_status = 'success'; } if ( isset( $_GET['expires_in'] ) ) { $token['expires_in'] = sanitize_text_field( wp_unslash( $_GET['expires_in'] ) ); // Expire date. $expire_date = new DateTime( '+' . sanitize_text_field( wp_unslash( $_GET['expires_in'] ) ) . ' seconds' ); $token['expire_date'] = $expire_date->format( 'Y-m-d' ); } if ( isset( $_GET['account_type'] ) ) { $token['account_type'] = sanitize_text_field( wp_unslash( $_GET['account_type'] ) ); } if ( isset( $_GET['username'] ) ) { $token['username'] = sanitize_text_field( wp_unslash( $_GET['username'] ) ); } if ( isset( $_GET['user_id'] ) ) { $token['user_id'] = sanitize_text_field( wp_unslash( $_GET['user_id'] ) ); } // phpcs:enable WordPress.Security.NonceVerification update_option( 'fusion_instagram_token', $token ); } /** * Revoke access. * * @access public * @since 3.8 */ public function revoke_access() { delete_option( 'fusion_instagram_token' ); // delete instagram cache on revoke. $this->reset_caches_handler(); $this->localize_status = 'revoke'; } /** * Refresh token before expire date. * * @access public * @since 3.8 */ public function refresh_token() { $token = $this->get_token(); // Exit if no token or expire date. if ( ! $token || ! is_array( $token ) || ! isset( $token['token'] ) || ! isset( $token['expire_date'] ) ) { return; } $expire_date = isset( $token['expire_date'] ) ? $token['expire_date'] : false; // Check 7 days before the expire date. $expire_date_gap = date( 'Y-m-d', strtotime( $expire_date . '-7 days' ) ); $today = date( 'Y-m-d' ); // Exit if today before the expire date gap. if ( $today < $expire_date_gap ) { return; } // Refresh token request. $response = wp_remote_get( 'https://graph.instagram.com/refresh_access_token?grant_type=ig_refresh_token&access_token=' . $token['token'] ); // Do nothing on error. if ( is_wp_error( $response ) ) { return; } $response_body = json_decode( wp_remote_retrieve_body( $response ), true ); // Update the current token. if ( isset( $response_body['access_token'], $response_body['expires_in'] ) ) { $token['token'] = $response_body['access_token']; $token['expires_in'] = $response_body['expires_in']; // Expire date. $expire_date = new DateTime( '+' . $response_body['expires_in'] . ' seconds' ); $token['expire_date'] = $expire_date->format( 'Y-m-d' ); update_option( 'fusion_instagram_token', $token ); } } /** * Instagram user media endpoint. * * @access public * @param array $data The enpoint data. * @since 3.8 */ public function media_endpoint( $data ) { $output = []; $limit = isset( $data['limit'] ) ? $data['limit'] : '20'; $page = isset( $data['page'] ) ? $data['page'] : '1'; $next = isset( $data['next'] ) ? $data['next'] : ''; $token = $this->get_token(); $timeout = self::get_timeout(); if ( empty( $token ) ) { $output['code'] = 400; $output['error_message'] = __( 'Currently not connected, Please connect to instagram and try again.', 'fusion-builder' ); } if ( ! empty( $token ) ) { $key = "fusion-instagram-element_user-{$token['user_id']}_limit-{$limit}_page-{$page}"; $cached_json = isset( $token['user_id'] ) ? get_transient( $key ) : false; if ( $cached_json ) { $output['code'] = 200; $output['json'] = $cached_json; } } // Get IG JSON request. if ( $token && is_array( $token ) && ! $cached_json ) { if ( $next ) { $url = "https://graph.instagram.com/v21.0/{$token['user_id']}/media/?limit={$limit}&access_token={$token['token']}&after={$next}&fields=caption,media_type,media_url,permalink,thumbnail_url,id&access_token={$token['token']}"; } else { $url = "https://graph.instagram.com/v21.0/{$token['user_id']}/media/?limit={$limit}&fields=caption,media_type,media_url,permalink,thumbnail_url,id&access_token={$token['token']}"; } $response = wp_remote_get( $url ); // Do nothing on error. if ( is_wp_error( $response ) ) { $output['code'] = 400; $output['error_message'] = $response->get_error_message(); } else { $output['code'] = 200; $json = json_decode( wp_remote_retrieve_body( $response ), true ); $output['json'] = $json; if ( isset( $json['error'] ) ) { $output['code'] = 400; $output['error_message'] = $json['error']['message']; } else { set_transient( $key, $json, $timeout ); // Add the transient dynamic key to the Instagram transient keys. // to delete dynamic transient properly especially if user has object cache enabled. $saved_keys = get_transient( 'fusion-instagram-transient-keys' ); if ( ! is_array( $saved_keys ) ) { $saved_keys = []; } $saved_keys[] = $key; set_transient( 'fusion-instagram-transient-keys', $saved_keys, $timeout ); } } } return $output; } /** * Instagram user media endpoint. * * @access public * @param array $data The enpoint data. * @since 3.8 */ public function media_children_endpoint( $data ) { $output = []; $token = $this->get_token(); $id = $data['id']; $timeout = self::get_timeout(); if ( empty( $token ) ) { $output['code'] = 400; $output['error_message'] = __( 'Currently not connected, Please connect to instagram and try again.', 'fusion-builder' ); } $key = "fusion-instagram-element-media-children-{$id}"; $cached_json = get_transient( $key ); if ( $cached_json ) { $output['code'] = 200; $output['json'] = $cached_json; } // Get IG JSON request. if ( $token && is_array( $token ) && ! $cached_json ) { $url = "https://graph.instagram.com/v21.0/{$id}/children/?fields=media_type,media_url,permalink,thumbnail_url,id&access_token={$token['token']}"; $response = wp_remote_get( $url ); if ( is_wp_error( $response ) ) { $output['code'] = 400; $output['error_message'] = $response->get_error_message(); } else { $output['code'] = 200; $json = json_decode( wp_remote_retrieve_body( $response ), true ); $output['json'] = $json; if ( isset( $json['error'] ) ) { $output['code'] = 400; $output['error_message'] = $json['error']['message']; } else { set_transient( $key, $json, $timeout ); // Add the transient dynamic key to the Instagram transient keys. // to delete dynamic transient properly especially if user has object cache enabled. $saved_keys = get_transient( 'fusion-instagram-transient-keys' ); if ( ! is_array( $saved_keys ) ) { $saved_keys = []; } $saved_keys[] = $key; set_transient( 'fusion-instagram-transient-keys', $saved_keys, $timeout ); } } } return $output; } /** * Registers instagrame endpoint. * * @access public * @since 3.8 */ public function register_instagram_endpoint() { // User media. register_rest_route( 'awb/instagram', '/media', [ 'methods' => 'GET', 'callback' => [ $this, 'media_endpoint' ], 'permission_callback' => '__return_true', ] ); // media_children. register_rest_route( 'awb/instagram', '/(?P\d+)/children', [ 'methods' => 'GET', 'callback' => [ $this, 'media_children_endpoint' ], 'permission_callback' => '__return_true', ] ); } /** * Delete cache. * * @access public * @since 3.8 * @return string */ public static function get_timeout() { $fusion_settings = awb_get_fusion_settings(); $timeout_option = $fusion_settings->get( 'instagram_cache_timeout' ); $timeout = DAY_IN_SECONDS; // day is the default. switch ( $timeout_option ) { case 'half_hour': $timeout = 60 * 30; break; case 'hour': $timeout = HOUR_IN_SECONDS; break; case 'half_day': $timeout = 60 * 60 * 12; break; case 'week': $timeout = WEEK_IN_SECONDS; break; } return $timeout; } /** * Delete cache. * * @access public * @since 3.8 * @return void */ public function delete_cache() { $transient_keys = get_transient( 'fusion-instagram-transient-keys' ); if ( is_array( $transient_keys ) ) { foreach ( $transient_keys as $key ) { delete_transient( $key ); } delete_transient( 'fusion-instagram-transient-keys' ); } } /** * Ajax callback reset instagram cache. * * @access public * @since 3.11.2 * @return void */ public function ajax_reset_instagram_cache() { // Check nonce. $option_name = class_exists( 'Fusion_Settings' ) ? Fusion_Settings::get_option_name() : 'fusion_options'; if ( is_admin() && current_user_can( 'manage_options' ) && check_ajax_referer( 'fusionredux_ajax_nonce' . $option_name, 'nonce' ) ) { $this->reset_caches_handler(); } } /** * Handles resetting caches. * * @access public * @since 3.8 * @return void */ public function reset_caches_handler() { if ( is_multisite() && is_main_site() ) { $sites = get_sites(); foreach ( $sites as $site ) { switch_to_blog( $site->blog_id ); $this->delete_cache(); restore_current_blog(); } return; } $this->delete_cache(); } } } new FusionSC_Instagram(); } /** * Map shortcode to Avada Builder. * * @since 1.0 */ function fusion_instagram_element() { fusion_builder_map( fusion_builder_frontend_data( 'FusionSC_Instagram', [ 'name' => esc_attr__( 'Instagram', 'fusion-builder' ), 'shortcode' => 'fusion_instagram', 'icon' => 'fusiona-instagram', 'help_url' => 'https://avada.com/documentation/instagram-element/', 'params' => [ [ 'type' => 'range', 'param_name' => 'limit', 'heading' => esc_attr__( 'Number Of Posts', 'fusion-builder' ), 'description' => esc_attr__( 'Choose the number of instagram posts you want to display.', 'fusion-builder' ), 'value' => 10, 'min' => 1, 'max' => 100, ], [ 'type' => 'radio_button_set', 'heading' => esc_attr__( 'Layout', 'fusion-builder' ), 'description' => __( 'Select the instagram feed layout type. Note: Image lazy loading disabled for masonry layout.', 'fusion-builder' ), 'param_name' => 'layout', 'value' => [ 'grid' => esc_attr__( 'Grid', 'fusion-builder' ), 'masonry' => esc_attr__( 'Masonry', 'fusion-builder' ), ], 'default' => 'grid', ], [ 'type' => 'select', 'heading' => esc_attr__( 'Images Aspect Ratio', 'fusion-builder' ), 'description' => esc_attr__( 'Select the aspect ratio of the images. Images will be cropped.', 'fusion-builder' ), 'param_name' => 'aspect_ratio', 'value' => [ '' => esc_attr__( 'Automatic', 'fusion-builder' ), '1-1' => esc_attr__( '1:1', 'fusion-builder' ), '2-1' => esc_attr__( '2:1', 'fusion-builder' ), '2-3' => esc_attr__( '2:3', 'fusion-builder' ), '3-1' => esc_attr__( '3:1', 'fusion-builder' ), '3-2' => esc_attr__( '3:2', 'fusion-builder' ), '4-1' => esc_attr__( '4:1', 'fusion-builder' ), '4-3' => esc_attr__( '4:3', 'fusion-builder' ), '5-4' => esc_attr__( '5:4', 'fusion-builder' ), '16-9' => esc_attr__( '16:9', 'fusion-builder' ), '9-16' => esc_attr__( '9:16', 'fusion-builder' ), '21-9' => esc_attr__( '21:9', 'fusion-builder' ), '9-21' => esc_attr__( '9:21', 'fusion-builder' ), 'custom' => esc_attr__( 'Custom', 'fusion-builder' ), ], 'dependency' => [ [ 'element' => 'layout', 'value' => 'masonry', 'operator' => '!=', ], ], ], [ 'type' => 'range', 'heading' => esc_attr__( 'Custom Aspect Ratio', 'fusion-builder' ), 'description' => esc_attr__( 'Set a custom aspect ratio for the images.', 'fusion-builder' ), 'param_name' => 'custom_aspect_ratio', 'min' => 0, 'max' => 500, 'value' => 100, 'dependency' => [ [ 'element' => 'layout', 'value' => 'masonry', 'operator' => '!=', ], [ 'element' => 'aspect_ratio', 'value' => 'custom', 'operator' => '==', ], ], ], [ 'type' => 'image_focus_point', 'heading' => esc_attr__( 'Image Focus Point', 'fusion-builder' ), 'description' => esc_attr__( 'Set the image focus point by dragging the blue dot.', 'fusion-builder' ), 'param_name' => 'aspect_ratio_position', 'image' => 'element_content', 'image_id' => 'image_id', 'dependency' => [ [ 'element' => 'layout', 'value' => 'masonry', 'operator' => '!=', ], [ 'element' => 'aspect_ratio', 'value' => '', 'operator' => '!=', ], ], ], [ 'type' => 'radio_button_set', 'heading' => esc_attr__( 'Hover Type', 'fusion-builder' ), 'description' => esc_attr__( 'Select the hover effect type.', 'fusion-builder' ), 'param_name' => 'hover_type', 'value' => [ 'none' => esc_attr__( 'None', 'fusion-builder' ), 'zoomin' => esc_attr__( 'Zoom In', 'fusion-builder' ), 'zoomout' => esc_attr__( 'Zoom Out', 'fusion-builder' ), 'liftup' => esc_attr__( 'Lift Up', 'fusion-builder' ), ], 'default' => 'none', ], [ 'type' => 'radio_button_set', 'param_name' => 'link_type', 'heading' => esc_attr__( 'Image Link', 'fusion-builder' ), 'description' => esc_attr__( 'Choose where the image should link to.', 'fusion-builder' ), 'default' => '', 'value' => [ '' => esc_html__( 'None', 'fusion-builder' ), 'lightbox' => esc_html__( 'Lightbox', 'fusion-builder' ), 'post' => esc_html__( 'Instagram Post', 'fusion-builder' ), ], ], [ 'type' => 'radio_button_set', 'param_name' => 'link_target', 'heading' => esc_attr__( 'Image Link Target', 'fusion-builder' ), 'description' => esc_html__( 'Controls how the link will open.', 'fusion-builder' ), 'default' => '', 'value' => [ '' => esc_html__( 'Same Window/Tab', 'fusion-builder' ), '_blank' => esc_html__( 'New Window/Tab', 'fusion-builder' ), ], 'dependency' => [ [ 'element' => 'link_type', 'value' => 'post', 'operator' => '==', ], ], ], [ 'type' => 'radio_button_set', 'param_name' => 'load_more', 'heading' => esc_attr__( 'Load More', 'fusion-builder' ), 'description' => esc_attr__( 'Choose load more type.', 'fusion-builder' ), 'default' => '', 'value' => [ '' => esc_html__( 'None', 'fusion-builder' ), 'button' => esc_html__( 'Load More Button', 'fusion-builder' ), 'infinite' => esc_html__( 'Infinite Scrolling', 'fusion-builder' ), ], ], [ 'type' => 'textfield', 'param_name' => 'load_more_btn_text', 'heading' => esc_attr__( 'Load More Button Text', 'fusion-builder' ), 'description' => esc_attr__( 'Insert custom load more button text.', 'fusion-builder' ), 'default' => esc_html__( 'Load More', 'fusion-builder' ), 'dependency' => [ [ 'element' => 'load_more', 'value' => 'button', 'operator' => '==', ], ], ], [ 'type' => 'radio_button_set', 'param_name' => 'follow_btn', 'heading' => esc_attr__( 'Follow Button', 'fusion-builder' ), 'description' => esc_attr__( 'Enable/Disable follow button.', 'fusion-builder' ), 'default' => 'no', 'value' => [ 'yes' => esc_html__( 'Yes', 'fusion-builder' ), 'no' => esc_html__( 'No', 'fusion-builder' ), ], ], [ 'type' => 'textfield', 'param_name' => 'follow_btn_text', 'heading' => esc_attr__( 'Follow Button Text', 'fusion-builder' ), 'description' => esc_attr__( 'Insert custom follow button text.', 'fusion-builder' ), 'default' => esc_html__( 'Follow Us On Instagram', 'fusion-builder' ), 'dependency' => [ [ 'element' => 'follow_btn', 'value' => 'yes', 'operator' => '==', ], ], ], [ 'type' => 'checkbox_button_set', 'heading' => esc_attr__( 'Element Visibility', 'fusion-builder' ), 'param_name' => 'hide_on_mobile', 'value' => fusion_builder_visibility_options( 'full' ), 'default' => fusion_builder_default_visibility( 'array' ), 'description' => esc_attr__( 'Choose to show or hide the element on small, medium or large screens. You can choose more than one at a time.', 'fusion-builder' ), ], 'fusion_sticky_visibility_placeholder' => [], [ 'type' => 'textfield', 'heading' => esc_attr__( 'CSS Class', 'fusion-builder' ), 'param_name' => 'class', 'value' => '', 'description' => esc_attr__( 'Add a class to the wrapping HTML element.', 'fusion-builder' ), ], [ 'type' => 'textfield', 'heading' => esc_attr__( 'CSS ID', 'fusion-builder' ), 'param_name' => 'id', 'value' => '', 'description' => esc_attr__( 'Add an ID to the wrapping HTML element.', 'fusion-builder' ), ], 'fusion_margin_placeholder' => [ 'param_name' => 'margin', 'value' => [ 'margin_top' => '', 'margin_right' => '', 'margin_bottom' => '', 'margin_left' => '', ], 'responsive' => [ 'state' => 'large', ], ], [ 'type' => 'range', 'param_name' => 'columns', 'heading' => esc_attr__( 'Number Of Columns', 'fusion-builder' ), 'description' => esc_attr__( 'Select the number of columns to display.', 'fusion-builder' ), 'value' => 4, 'min' => 1, 'max' => 10, 'responsive' => [ 'state' => 'large', ], 'group' => esc_attr__( 'Design', 'fusion-builder' ), ], [ 'type' => 'range', 'param_name' => 'columns_spacing', 'heading' => esc_attr__( 'Column Spacing', 'fusion-builder' ), 'description' => esc_attr__( 'Choose the spacing between columns.', 'fusion-builder' ), 'value' => 10, 'min' => 0, 'max' => 100, 'responsive' => [ 'state' => 'large', ], 'group' => esc_attr__( 'Design', 'fusion-builder' ), ], [ 'type' => 'range', 'heading' => esc_attr__( 'Instagram Post Border Size', 'fusion-builder' ), 'description' => esc_attr__( 'In pixels.', 'fusion-builder' ), 'param_name' => 'bordersize', 'value' => 0, 'min' => 0, 'max' => 50, 'step' => 1, 'group' => esc_attr__( 'Design', 'fusion-builder' ), ], [ 'type' => 'colorpickeralpha', 'heading' => esc_attr__( 'Instagram Post Border Color', 'fusion-builder' ), 'description' => esc_attr__( 'Choose the border color. ', 'fusion-builder' ), 'param_name' => 'bordercolor', 'value' => '', 'default' => '', 'group' => esc_attr__( 'Design', 'fusion-builder' ), 'dependency' => [ [ 'element' => 'bordersize', 'value' => 0, 'operator' => '>', ], ], ], [ 'type' => 'textfield', 'heading' => esc_attr__( 'Instagram Post Border Radius', 'fusion-builder' ), 'description' => esc_attr__( 'Controls the instagram post border radius. In pixels (px), ex: 1px, or "round". ', 'fusion-builder' ), 'param_name' => 'border_radius', 'value' => '', 'group' => esc_attr__( 'Design', 'fusion-builder' ), ], [ 'heading' => esc_html__( 'Buttons Layout', 'fusion-builder' ), 'description' => esc_html__( 'Select the layout of the buttons.', 'fusion-builder' ), 'param_name' => 'buttons_layout', 'default' => 'floated', 'type' => 'radio_button_set', 'transport' => 'postMessage', 'group' => esc_html__( 'Design', 'fusion-builder' ), 'value' => [ 'floated' => esc_html__( 'Floated', 'fusion-builder' ), 'stacked' => esc_html__( 'Stacked', 'fusion-builder' ), ], 'responsive' => [ 'state' => 'large', ], ], [ 'type' => 'radio_button_set', 'heading' => esc_attr__( 'Buttons Span', 'fusion-builder' ), 'description' => esc_attr__( 'Controls if the buttons spans the full width/remaining width of row.', 'fusion-builder' ), 'param_name' => 'buttons_span', 'default' => 'no', 'group' => esc_html__( 'Design', 'fusion-builder' ), 'value' => [ 'default' => esc_attr__( 'Default', 'fusion-builder' ), 'yes' => esc_attr__( 'Yes', 'fusion-builder' ), 'no' => esc_attr__( 'No', 'fusion-builder' ), ], 'or' => true, 'dependency' => [ [ 'element' => 'load_more', 'value' => 'button', 'operator' => '==', ], [ 'element' => 'follow_btn', 'value' => 'yes', 'operator' => '==', ], ], ], [ 'type' => 'radio_button_set', 'heading' => esc_html__( 'Buttons Alignment', 'fusion-builder' ), 'description' => esc_html__( 'Select buttons alignment.', 'fusion-builder' ), 'param_name' => 'buttons_alignment', 'default' => 'center', 'grid_layout' => true, 'back_icons' => true, 'icons' => [ 'flex-start' => '', 'center' => '', 'flex-end' => '', 'space-between' => '', ], 'value' => [ // We use "start/end" terminology because flex direction changes depending on RTL/LTR. 'flex-start' => esc_html__( 'Flex Start', 'fusion-builder' ), 'center' => esc_html__( 'Center', 'fusion-builder' ), 'flex-end' => esc_html__( 'Flex End', 'fusion-builder' ), 'space-between' => esc_html__( 'Space Between', 'fusion-builder' ), ], 'group' => esc_attr__( 'Design', 'fusion-builder' ), 'or' => true, 'dependency' => [ [ 'element' => 'load_more', 'value' => 'button', 'operator' => '==', ], [ 'element' => 'follow_btn', 'value' => 'yes', 'operator' => '==', ], ], ], [ 'type' => 'colorpickeralpha', 'heading' => esc_attr__( 'Load More Button Text Color', 'fusion-builder' ), 'description' => esc_attr__( 'Select load more button text color.', 'fusion-builder' ), 'param_name' => 'load_more_btn_color', 'group' => esc_html__( 'Design', 'fusion-builder' ), 'value' => '', 'default' => 'var(--awb-color8)', 'dependency' => [ [ 'element' => 'load_more', 'value' => 'button', 'operator' => '==', ], ], 'states' => [ 'hover' => [ 'label' => __( 'Hover', 'fusion-builder' ), 'param_name' => 'load_more_btn_hover_color', 'default' => 'var(--awb-color1)', 'preview' => [ 'selector' => '.awb-instagram-load-more-btn', 'type' => 'class', 'toggle' => 'hover', ], ], ], 'connect-state' => [ 'load_more_btn_bg_color' ], ], [ 'type' => 'colorpickeralpha', 'heading' => esc_attr__( 'Load More Button Background Color', 'fusion-builder' ), 'description' => esc_attr__( 'Select load more button background color.', 'fusion-builder' ), 'param_name' => 'load_more_btn_bg_color', 'group' => esc_html__( 'Design', 'fusion-builder' ), 'value' => '', 'default' => 'var(--awb-color3)', 'dependency' => [ [ 'element' => 'load_more', 'value' => 'button', 'operator' => '==', ], ], 'states' => [ 'hover' => [ 'label' => __( 'Hover', 'fusion-builder' ), 'default' => 'var(--awb-color5)', 'param_name' => 'load_more_btn_hover_bg_color', 'preview' => [ 'selector' => '.awb-instagram-load-more-btn', 'type' => 'class', 'toggle' => 'hover', ], ], ], 'connect-state' => [ 'load_more_btn_color' ], ], [ 'type' => 'colorpickeralpha', 'heading' => esc_attr__( 'Follow Button Text Color', 'fusion-builder' ), 'description' => esc_attr__( 'Select follow button text color.', 'fusion-builder' ), 'param_name' => 'follow_btn_color', 'group' => esc_html__( 'Design', 'fusion-builder' ), 'value' => '', 'default' => 'var(--awb-color1)', 'dependency' => [ [ 'element' => 'follow_btn', 'value' => 'yes', 'operator' => '==', ], ], 'states' => [ 'hover' => [ 'label' => __( 'Hover', 'fusion-builder' ), 'default' => 'var(--awb-color1)', 'param_name' => 'follow_btn_hover_color', 'preview' => [ 'selector' => '.awb-instagram-follow-btn', 'type' => 'class', 'toggle' => 'hover', ], ], ], 'connect-state' => [ 'follow_btn_bg_color' ], ], [ 'type' => 'colorpickeralpha', 'heading' => esc_attr__( 'Follow Button Background Color', 'fusion-builder' ), 'description' => esc_attr__( 'Select follow button background color.', 'fusion-builder' ), 'param_name' => 'follow_btn_bg_color', 'group' => esc_html__( 'Design', 'fusion-builder' ), 'value' => '', 'default' => 'var(--awb-color7)', 'dependency' => [ [ 'element' => 'follow_btn', 'value' => 'yes', 'operator' => '==', ], ], 'states' => [ 'hover' => [ 'label' => __( 'Hover', 'fusion-builder' ), 'default' => 'var(--awb-color5)', 'param_name' => 'follow_btn_hover_bg_color', 'preview' => [ 'selector' => '.awb-instagram-follow-btn', 'type' => 'class', 'toggle' => 'hover', ], ], ], 'connect-state' => [ 'follow_btn_color' ], ], 'fusion_conditional_render_placeholder' => [], 'fusion_animation_placeholder' => [ 'preview_selector' => '.awb-instagram-element', ], [ 'type' => 'raw', 'description' => '

', 'param_name' => 'extra_space', 'group' => esc_html__( 'Design', 'fusion-builder' ), 'value' => '', ], ], ] ) ); } add_action( 'fusion_builder_before_init', 'fusion_instagram_element' );