10h30/full-screen-morphing-search
1
0
Fork 0
mirror of https://github.com/10h30/full-screen-morphing-search.git synced 2026-06-05 15:08:32 +09:00
Code Issues Packages Projects Releases Wiki Activity

Search Form Text & Icons

Browse Source
This commit is contained in:
LebCit
2019-07-25 06:09:36 +03:00
parent efc56b7339
commit 93bc7bfc1e
5 changed files with 528 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/full-screen-morphing-search.css
+2 -1
View File
@@ -297,7 +297,8 @@ input[type="search"] { /* reset normalize */
.dummy-media-object img {
display: inline-block;
width: 50px;
width: 50px;
height: 50px;
margin: 0 10px 0 0;
vertical-align: middle;
}
assets/js/customize-preview.js
+115 -4
View File
@@ -59,7 +59,7 @@
$( 'div.dummy-media-object' ).css( 'background', newval );
$( 'div.dummy-media-object' ).mouseout( function() {
$(this).css( 'background', newval );
});
} );
} );
} );
@@ -68,7 +68,7 @@
value.bind( function( newval ) {
$( 'div.dummy-media-object' ).mouseover( function() {
$(this).css( 'background', newval );
});
} );
} );
} );
@@ -78,7 +78,7 @@
$( '.dummy-media-object h3 a' ).css( 'color', newval );
$( 'div.dummy-media-object' ).mouseout( function() {
$(this).find( 'h3 a' ).css( 'color', newval );
});
} );
} );
} );
@@ -87,8 +87,119 @@
value.bind( function( newval ) {
$( 'div.dummy-media-object' ).mouseover( function() {
$(this).find( 'h3 a' ).css( 'color', newval );
});
} );
} );
} );
// FSMS Search Form Text.
wp.customize( 'fsmsp_options[fsmsp_search_form_text]', function( value ) {
value.bind( function( newval ) {
$( 'input.morphsearch-input' ).attr( 'placeholder', newval );
} );
} );
/**
* MutationObserver to display the default placeholder text (search...),
* when the user erases all charachters of his text in the FSMS Search Form Text option.
*/
let targetNodePhTxt = $( "input.morphsearch-input" )[0]; // Get the Node element.
let observerPhTxt = new MutationObserver( callbackPhTxt );
let obsConfigPhTxt = { attributes: true };
observerPhTxt.observe( targetNodePhTxt, obsConfigPhTxt );
function callbackPhTxt(mutations) {
mutations.forEach( function( mutation ) {
if ( mutation.target.placeholder.length == 0 ) {
$( '.morphsearch-form .morphsearch-input' ).attr( 'placeholder', fsmsp_cp.fsmsp_placeholder_text );
}
} );
}
/**
* MutationObserver to prevent weird behaviour in Chrome and Edge, when input of text control option is clicked/focused.
* Not needed but added to reflect same behaviour as on the live site (not Customizer preview).
* When the overlay comes out, focus() on .morphsearch-input, then close it if we press on the Esc button.
*/
let targetNode = $( '#morphsearch' )[0]; // Get the Node element.
let observerNode = new MutationObserver( mutationNodeCallback );
let obsNodeConfig = { attributes: true };
observerNode.observe( targetNode, obsNodeConfig );
function mutationNodeCallback( mutations ) {
mutations.forEach( function( mutation ) {
if ( 'attributes' === mutation.type ) {
// This focus() will affect every input in a form[role=search] !
$( '.morphsearch-input' ).focus();
$( '.morphsearch' ).on( 'keydown', function( event ) {
if (event.keyCode === 27) {
// Remove the focus() first with blur() on every form[role=search] input !
$( 'form[role=search] input' ).blur();
// Close the overlay : $( '.morphsearch-close' ).click();
$( '.morphsearch' ).removeClass( 'open' );
}
} );
}
} );
}
/**
* Following MutationObserver are to display the default icon for each column when no Icon/Image is provided.
* This will take effect when the Remove button is clicked while in the Customizer preview.
*/
// 1- MutationObserver for article icon.
let targetObjArt = $( '.fsmsp-article-link' ); // Get the Object element NOT the Node.
let observerObjArt = new MutationObserver( callbackArt );
let obsConfigArt = { childList: true };
targetObjArt.each( function() {
/**
* Using .each( function() { } ); since we have more than one object element matching our request.
*/
observerObjArt.observe( this, obsConfigArt );
} );
function callbackArt( mutationList ) {
mutationList.forEach( function( mutation ) {
if ( mutation.type == 'childList' ) {
/**
* When <span class="customize-partial-edit-shortcut customize-partial-edit-shortcut-fsmsp_article_icon">
* is the only child left (this is when we click on the remove button after adding a chosen image/icon),
* we append the default article icon (fsmsp_cp.fsmsp_article_icon) to the targetObjArt.
*/
if ( mutation.target.childNodes.length == 1 ) {
targetObjArt.append( fsmsp_cp.fsmsp_article_icon );
}
}
} );
}
// 2- MutationObserver for category icon.
var targetObjCat = $( '.fsmsp-category-image' ); // Get the Object element NOT the Node.
var observerCat = new MutationObserver(callbackCategory);
var obsConfigCat = { childList: true };
targetObjCat.each( function() {
observerCat.observe(this, obsConfigCat);
} );
function callbackCategory( mutationList ) {
mutationList.forEach( function( mutation ) {
if ( mutation.type == 'childList' ) {
if ( mutation.target.childNodes.length == 1 ) {
targetObjCat.append( fsmsp_cp.fsmsp_category_icon );
}
}
} );
}
// 3- MutationObserver for tag icon.
var targetObjTag = $( '.fsmsp-tag-image' ); // Get the Object element NOT the Node.
var observerTag = new MutationObserver(callbackTag);
var obsConfigTag = { childList: true };
targetObjTag.each( function() {
observerTag.observe(this, obsConfigTag);
} );
function callbackTag( mutationList ) {
mutationList.forEach( function( mutation ) {
if ( mutation.type == 'childList' ) {
if ( mutation.target.childNodes.length == 1 ) {
targetObjTag.append( fsmsp_cp.fsmsp_tag_icon );
}
}
} );
}
} )( jQuery );
assets/js/full-screen-morphing-search.js
+6 -1
View File
@@ -23,7 +23,7 @@
*/
if (!fsmsp_vars.fsmsp_is_customize_preview) {
setTimeout(function () {
$('.morphsearch input.morphsearch-input').focus();
$('#morphsearch > form > input.morphsearch-input').focus();
}, 500);
}
} );
@@ -96,6 +96,9 @@
// Output fsmsp_links_color.
$( '.dummy-media-object h3 a' ).css( 'color', '#b2b2b2' );
// Output fsmsp_search_form_text.
$( 'form.morphsearch-form' ).children().first().attr( 'placeholder', 'Search...' );
} else {
$( '#morphsearch, div.morphsearch-content' ).css( 'background-color', fsmsp_vars.fsmsp_main_backgroung_color );
@@ -123,6 +126,8 @@
$( '.dummy-media-object h3 a' ).css( 'color', fsmsp_vars.fsmsp_links_color );
$( 'form.morphsearch-form' ).children().first().attr( 'placeholder', fsmsp_vars.fsmsp_search_form_text );
}
} )( jQuery );
class-full-screen-morphing-search.php
+86 -57
View File
@@ -88,6 +88,7 @@ class Full_Screen_Morphing_Search {
'fsmsp_columns_hover_background_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_columns_hover_background_color'] ) ? $fsmsp_options['fsmsp_columns_hover_background_color'] : '#e4e4e5' ) ),
'fsmsp_links_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_links_color'] ) ? $fsmsp_options['fsmsp_links_color'] : '#b2b2b2' ) ),
'fsmsp_links_hover_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_links_hover_color'] ) ? $fsmsp_options['fsmsp_links_hover_color'] : '#ec5a62' ) ),
'fsmsp_search_form_text' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_search_form_text'] ) ? $fsmsp_options['fsmsp_search_form_text'] : 'Search&hellip;' ) ),
)
);
@@ -108,9 +109,7 @@ class Full_Screen_Morphing_Search {
<div id="morphsearch" class="morphsearch">
<span class="morphsearch-close"></span>
<form role="search" class="morphsearch-form" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<input required type="search" class="morphsearch-input" name="s"
placeholder="<?php echo esc_attr_x( 'Search...', 'placeholder' ); ?>"
value=""/>
<input required type="search" class="morphsearch-input" name="s" placeholder="" value=""/>
<button id="morphsearch-submit" class="morphsearch-submit" type="submit">
<?php
$response = wp_remote_get( 'https://plugins.svn.wordpress.org/full-screen-morphing-search/trunk/assets/img/magnifier.svg' );
@@ -123,58 +122,80 @@ class Full_Screen_Morphing_Search {
<div class="morphsearch-content">
<div class="dummy-column">
<h2>Recent Posts</h2>
<h2 class="fsmsp-rp">Recent Posts</h2>
<?php
$args = array(
$args = array(
'post_type' => 'post',
'posts_per_page' => '5',
'ignore_sticky_posts' => 1,
);
$msprp = new WP_Query( $args );
while ( $msprp->have_posts() ) :
$msprp->the_post();
$fsmsprp = new WP_Query( $args );
while ( $fsmsprp->have_posts() ) :
$fsmsprp->the_post();
?>
<div class="dummy-media-object">
<?php
if ( has_post_thumbnail() ) {
?>
<a href="<?php echo the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php echo the_post_thumbnail( 'msp-thumb', array( 'class' => 'round' ) ); ?>
</a>
<h3>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php the_title(); ?>
</a>
</h3>
</div>
<?php
} else {
?>
<a href="<?php echo the_permalink(); ?>" class="fsmsp-article-link" title="<?php the_title_attribute(); ?>">
<?php
}
if ( has_post_thumbnail() ) {
echo the_post_thumbnail( 'full-screen-morphing-search-plugin-thumb', array( 'class' => 'round' ) );
} else {
if ( empty( $fsmsp_options['fsmsp_article_icon'] ) ) {
echo '<img src="' . esc_url( plugins_url( 'assets/img/article.png', __FILE__ ) ) . '" >';
} else {
full_screen_morphing_search_article_icon();
}
}
?>
</a>
<h3><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h3>
</div>
<?php
endwhile;
wp_reset_postdata();
?>
</div>
<div class="dummy-column">
<h2>Top Categories</h2>
<h2 class="fsmsp-tc">Top Categories</h2>
<?php
$cats = get_categories();
if ( empty( $cats ) ) {
$fsmspcats = get_categories();
if ( empty( $fsmspcats ) ) {
return;
}
$tc_counts = array();
$cat_links = array();
foreach ( (array) $cats as $cat ) {
$tc_counts[ $cat->name ] = $cat->count;
$cat_links[ $cat->name ] = get_category_link( $cat->term_id );
$fsmsptc_counts = array();
$fsmspcat_links = array();
foreach ( (array) $fsmspcats as $fsmspcat ) {
$fsmsptc_counts[ $fsmspcat->name ] = $fsmspcat->count;
$fsmspcat_links[ $fsmspcat->name ] = get_category_link( $fsmspcat->term_id );
}
asort( $tc_counts );
$tc_counts = array_reverse( $tc_counts, true );
$i = 0;
foreach ( $tc_counts as $cat => $tc_count ) {
asort( $fsmsptc_counts );
$fsmsptc_counts = array_reverse( $fsmsptc_counts, true );
$i = 0;
foreach ( $fsmsptc_counts as $fsmspcat => $fsmsptc_count ) {
$i++;
$cat_link = esc_url( $cat_links[ $cat ] );
$cat = str_replace( ' ', '&nbsp;', esc_html( $cat ) );
$fsmspcat_link = esc_url( $fsmspcat_links[ $fsmspcat ] );
$fsmspcat = str_replace( ' ', '&nbsp;', esc_html( $fsmspcat ) );
if ( $i < 6 ) {
?>
<div class="dummy-media-object">
<div class="dummy-media-object fsmsp-tc-child">
<span class="fsmsp-category-image">
<?php
if ( empty( $fsmsp_options['fsmsp_category_icon'] ) ) {
echo '<img src="' . esc_url( plugins_url( 'assets/img/category.png', __FILE__ ) ) . '" >';
} else {
full_screen_morphing_search_category_icon();
}
?>
</span>
<?php
echo '<img src="' . esc_url( plugins_url( 'assets/img/category.png', __FILE__ ) ) . '" > ';
print "<h3><a href='" . esc_url( $cat_link ) . "'>" . esc_html( $cat . ' (' . $tc_count . ')' ) . '</a></h3>';
print "<h3><a href='" . esc_url( $fsmspcat_link ) . "'>" . esc_html( $fsmspcat . ' (' . $fsmsptc_count . ')' ) . '</a></h3>';
?>
</div>
<?php
@@ -183,33 +204,41 @@ class Full_Screen_Morphing_Search {
?>
</div>
<div class="dummy-column">
<h2>Top Tags</h2>
<h2 class="fsmsp-tt">Top Tags</h2>
<?php
$tags = get_tags();
if ( empty( $tags ) ) {
$fsmsptags = get_tags();
if ( empty( $fsmsptags ) ) {
return;
}
$tt_counts = array();
$tag_links = array();
foreach ( (array) $tags as $tag ) {
$tt_counts[ $tag->name ] = $tag->count;
$tag_links[ $tag->name ] = get_tag_link( $tag->term_id );
$fsmsptt_counts = array();
$fsmsptag_links = array();
foreach ( (array) $fsmsptags as $fsmsptag ) {
$fsmsptt_counts[ $fsmsptag->name ] = $fsmsptag->count;
$fsmsptag_links[ $fsmsptag->name ] = get_tag_link( $fsmsptag->term_id );
}
asort( $tt_counts );
$tt_counts = array_reverse( $tt_counts, true );
$i = 0;
foreach ( $tt_counts as $tag => $tt_count ) {
asort( $fsmsptt_counts );
$fsmsptt_counts = array_reverse( $fsmsptt_counts, true );
$i = 0;
foreach ( $fsmsptt_counts as $fsmsptag => $fsmsptt_count ) {
$i++;
$tag_link = esc_url( $tag_links[ $tag ] );
$tag = str_replace( ' ', '&nbsp;', esc_html( $tag ) );
$tag_link = esc_url( $fsmsptag_links[ $fsmsptag ] );
$fsmsptag = str_replace( ' ', '&nbsp;', esc_html( $fsmsptag ) );
if ( $i < 6 ) {
?>
<div class="dummy-media-object">
<div class="dummy-media-object fsmsp-tt-child">
<span class="fsmsp-tag-image">
<?php
echo '<img src="' . esc_url( plugins_url( 'assets/img/tag.png', __FILE__ ) ) . '" >';
print "<h3><a href='" . esc_url( $tag_link ) . "'>" . esc_html( $tag . ' (' . $tt_count . ')' ) . '</a></h3>';
if ( empty( $fsmsp_options['fsmsp_tag_icon'] ) ) {
echo '<img src="' . esc_url( plugins_url( 'assets/img/tag.png', __FILE__ ) ) . '" >';
} else {
full_screen_morphing_search_tag_icon();
}
?>
</div>
</span>
<?php
print "<h3><a href='" . esc_url( $tag_link ) . "'>" . esc_html( $fsmsptag . ' (' . $fsmsptt_count . ')' ) . '</a></h3>';
?>
</div>
<?php
}
}
@@ -220,19 +249,19 @@ class Full_Screen_Morphing_Search {
</div><!-- #morphsearch.morphsearch -->
<?php
$fsmsac = array( // Autocomplete.
$fsmsp_ac = array( // Autocomplete.
'post_type' => array( 'post', 'page' ),
'post_status' => 'publish',
'posts_per_page' => -1, // all posts and pages.
);
$posts = get_posts( $fsmsac );
$posts = get_posts( $fsmsp_ac );
if ( $posts ) :
foreach ( $posts as $k => $post ) {
$source[ $k ]['ID'] = $post->ID;
$source[ $k ]['label'] = $post->post_title; // The name of the post.
$source[ $k ]['permalink'] = get_permalink( $post->ID );
$source[ $k ]['ID'] = $post->ID;
$source[ $k ]['label'] = $post->post_title; // The name of the post.
$source[ $k ]['permalink'] = get_permalink( $post->ID );
}
?>
@@ -250,7 +279,7 @@ class Full_Screen_Morphing_Search {
});
</script>
<?php
endif;
endif;
}
functions-full-screen-morphing-search.php
+319 -1
View File
@@ -35,7 +35,7 @@ function fsmsp_customize_preview_js() {
'fsmsp_article_icon' => '<img src="' . esc_url( plugins_url( 'assets/img/article.png', __FILE__ ) ) . '">',
'fsmsp_category_icon' => '<img src="' . esc_url( plugins_url( 'assets/img/category.png', __FILE__ ) ) . '">',
'fsmsp_tag_icon' => '<img src="' . esc_url( plugins_url( 'assets/img/tag.png', __FILE__ ) ) . '">',
'fsmsp_placeholder_text' => esc_attr( 'Search &hellip;' ),
'fsmsp_placeholder_text' => esc_attr( 'Search&hellip;' ),
)
);
}
@@ -382,5 +382,323 @@ function full_screen_morphing_search_customize_register( $wp_customize ) {
)
);
// Add Search Form Section.
$wp_customize->add_section(
'fsmsp_search_form',
array(
'title' => __( 'FSMS Search Form', 'full-screen-morphing-search' ),
'priority' => 10,
'panel' => 'fsmsp_panel',
)
);
// ==========================
// = FSMS Search Form Text. =
// ==========================
$wp_customize->add_setting(
'fsmsp_options[fsmsp_search_form_text]',
array(
'default' => '',
'sanitize_callback' => 'wp_filter_nohtml_kses', // Strips all HTML from a text string.
'capability' => 'edit_theme_options',
'type' => 'option',
'transport' => 'postMessage',
)
);
$wp_customize->add_control(
'fsmsp_options[fsmsp_search_form_text]',
array(
'label' => __( 'FSMS Search Form Text', 'full-screen-morphing-search' ),
'description' => esc_attr__( 'Change the search form text. If leaved blank, it will return to original value !', 'full-screen-morphing-search' ),
'section' => 'fsmsp_search_form',
'settings' => 'fsmsp_options[fsmsp_search_form_text]',
'type' => 'text',
'input_attrs' => array(
'placeholder' => __( 'Search&hellip;', 'full-screen-morphing-search' ),
),
)
);
// Add Icons Section.
$wp_customize->add_section(
'fsmsp_icons',
array(
'title' => __( 'FSMS Icons', 'full-screen-morphing-search' ),
'priority' => 15,
'panel' => 'fsmsp_panel',
)
);
// ======================
// = FSMS Article Icon. =
// ======================
$wp_customize->add_setting(
'fsmsp_options[fsmsp_article_icon]',
array(
'default' => '',
'type' => 'option',
'transport' => 'postMessage',
'sanitize_callback' => 'esc_url_raw',
)
);
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'fsmsp_options[fsmsp_article_icon]',
array(
'label' => __( 'FSMS Article Icon', 'full-screen-morphing-search' ),
'description' => esc_attr__( 'Change the article icon.', 'full-screen-morphing-search' ),
'section' => 'fsmsp_icons',
'settings' => 'fsmsp_options[fsmsp_article_icon]',
'button_labels' => array(
'select' => __( 'Select Article Icon' ),
'change' => __( 'Change Article Icon' ),
'remove' => __( 'Remove' ),
'frame_title' => __( 'Select Article Icon' ),
'frame_button' => __( 'Choose Article Icon' ),
),
)
)
);
$wp_customize->selective_refresh->add_partial(
'fsmsp_options[fsmsp_article_icon]',
array(
'selector' => 'div.dummy-media-object a.fsmsp-article-link',
'settings' => array( 'fsmsp_options[fsmsp_article_icon]' ),
'render_callback' => 'full_screen_morphing_search_article_icon',
)
);
// ====================================
// = FSMS Article Icon/Image Classes. =
// ====================================
$wp_customize->add_setting(
'fsmsp_options[fsmsp_article_i_classes]',
array(
'default' => true,
'type' => 'option',
'transport' => 'postMessage',
'sanitize_callback' => 'wp_validate_boolean',
)
);
$wp_customize->add_control(
'fsmsp_options[fsmsp_article_i_classes]',
array(
'label' => __( 'Article Icon/Image Round or Not ?!', 'full-screen-morphing-search' ),
'section' => 'fsmsp_icons',
'settings' => 'fsmsp_options[fsmsp_article_i_classes]',
'type' => 'checkbox',
)
);
$wp_customize->selective_refresh->add_partial(
'fsmsp_options[fsmsp_article_i_classes]',
array(
'selector' => 'div.dummy-media-object a.fsmsp-article-link',
'settings' => array( 'fsmsp_options[fsmsp_article_i_classes]' ),
'render_callback' => 'full_screen_morphing_search_article_icon',
)
);
// =======================
// = FSMS Category Icon. =
// =======================
$wp_customize->add_setting(
'fsmsp_options[fsmsp_category_icon]',
array(
'default' => '',
'type' => 'option',
'transport' => 'postMessage',
'sanitize_callback' => 'esc_url_raw',
)
);
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'fsmsp_options[fsmsp_category_icon]',
array(
'label' => __( 'FSMS Category Icon', 'full-screen-morphing-search' ),
'description' => esc_attr__( 'Change the category icon.', 'full-screen-morphing-search' ),
'section' => 'fsmsp_icons',
'settings' => 'fsmsp_options[fsmsp_category_icon]',
'button_labels' => array(
'select' => __( 'Select Category Icon' ),
'change' => __( 'Change Category Icon' ),
'remove' => __( 'Remove' ),
'frame_title' => __( 'Select Category Icon' ),
'frame_button' => __( 'Choose Category Icon' ),
),
)
)
);
$wp_customize->selective_refresh->add_partial(
'fsmsp_options[fsmsp_category_icon]',
array(
'selector' => 'span.fsmsp-category-image',
'settings' => array( 'fsmsp_options[fsmsp_category_icon]' ),
'render_callback' => 'full_screen_morphing_search_category_icon',
)
);
// =====================================
// = FSMS Category Icon/Image Classes. =
// =====================================
$wp_customize->add_setting(
'fsmsp_options[fsmsp_category_i_classes]',
array(
'default' => true,
'type' => 'option',
'transport' => 'postMessage',
'sanitize_callback' => 'wp_validate_boolean',
)
);
$wp_customize->add_control(
'fsmsp_options[fsmsp_category_i_classes]',
array(
'label' => __( 'Category Icon/Image Round or Not ?!', 'full-screen-morphing-search' ),
'section' => 'fsmsp_icons',
'settings' => 'fsmsp_options[fsmsp_category_i_classes]',
'type' => 'checkbox',
)
);
$wp_customize->selective_refresh->add_partial(
'fsmsp_options[fsmsp_category_i_classes]',
array(
'selector' => 'span.fsmsp-category-image',
'settings' => array( 'fsmsp_options[fsmsp_category_i_classes]' ),
'render_callback' => 'full_screen_morphing_search_category_icon',
)
);
// ==================
// = FSMS Tag Icon. =
// ==================
$wp_customize->add_setting(
'fsmsp_options[fsmsp_tag_icon]',
array(
'default' => '',
'type' => 'option',
'transport' => 'postMessage',
'sanitize_callback' => 'esc_url_raw',
)
);
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'fsmsp_options[fsmsp_tag_icon]',
array(
'label' => __( 'FSMS Tag Icon', 'full-screen-morphing-search' ),
'description' => esc_attr__( 'Change the tag icon.', 'full-screen-morphing-search' ),
'section' => 'fsmsp_icons',
'settings' => 'fsmsp_options[fsmsp_tag_icon]',
'button_labels' => array(
'select' => __( 'Select Tag Icon' ),
'change' => __( 'Change Tag Icon' ),
'remove' => __( 'Remove' ),
'frame_title' => __( 'Select Tag Icon' ),
'frame_button' => __( 'Choose Tag Icon' ),
),
)
)
);
$wp_customize->selective_refresh->add_partial(
'fsmsp_options[fsmsp_tag_icon]',
array(
'selector' => 'span.fsmsp-tag-image',
'settings' => array( 'fsmsp_options[fsmsp_tag_icon]' ),
'render_callback' => 'full_screen_morphing_search_tag_icon',
)
);
// ================================
// = FSMS Tag Icon/Image Classes. =
// ================================
$wp_customize->add_setting(
'fsmsp_options[fsmsp_tag_i_classes]',
array(
'default' => true,
'type' => 'option',
'transport' => 'postMessage',
'sanitize_callback' => 'wp_validate_boolean',
)
);
$wp_customize->add_control(
'fsmsp_options[fsmsp_tag_i_classes]',
array(
'label' => __( 'Tag Icon/Image Round or Not ?!', 'full-screen-morphing-search' ),
'section' => 'fsmsp_icons',
'settings' => 'fsmsp_options[fsmsp_tag_i_classes]',
'type' => 'checkbox',
)
);
$wp_customize->selective_refresh->add_partial(
'fsmsp_options[fsmsp_tag_i_classes]',
array(
'selector' => 'span.fsmsp-tag-image',
'settings' => array( 'fsmsp_options[fsmsp_tag_i_classes]' ),
'render_callback' => 'full_screen_morphing_search_tag_icon',
)
);
}
add_action( 'customize_register', 'full_screen_morphing_search_customize_register' );
/**
* Render article icon for the selective refresh partial.
*/
function full_screen_morphing_search_article_icon() {
$image_url = get_option( 'fsmsp_options' )['fsmsp_article_icon'];
$attachment_id = attachment_url_to_postid( $image_url ); // Tries to convert an attachment URL into a post ID.
$article_i_classes = get_option( 'fsmsp_options' )['fsmsp_article_i_classes'];
$classes;
if ( ! empty( $article_i_classes ) ) {
$classes = 'round fsmsp-article-icon';
} else {
$classes = 'fsmsp-article-icon';
}
echo wp_get_attachment_image( $attachment_id, 'thumbnail', '', array( 'class' => $classes ) ); // Get an HTML img element representing an image attachment.
}
/**
* Render category icon for the selective refresh partial.
*/
function full_screen_morphing_search_category_icon() {
$imagecat_url = get_option( 'fsmsp_options' )['fsmsp_category_icon'];
$attachmentcat_id = attachment_url_to_postid( $imagecat_url );
$category_i_classes = get_option( 'fsmsp_options' )['fsmsp_category_i_classes'];
$classes;
if ( ! empty( $category_i_classes ) ) {
$classes = 'round fsmsp-category-icon';
} else {
$classes = 'fsmsp-category-icon';
}
echo wp_get_attachment_image( $attachmentcat_id, 'thumbnail', '', array( 'class' => $classes ) );
}
/**
* Render tag icon for the selective refresh partial.
*/
function full_screen_morphing_search_tag_icon() {
$imagetag_url = get_option( 'fsmsp_options' )['fsmsp_tag_icon'];
$attachmenttag_id = attachment_url_to_postid( $imagetag_url );
$tag_i_classes = get_option( 'fsmsp_options' )['fsmsp_tag_i_classes'];
$classes;
if ( ! empty( $tag_i_classes ) ) {
$classes = 'round fsmsp-tag-icon';
} else {
$classes = 'fsmsp-tag-icon';
}
echo wp_get_attachment_image( $attachmenttag_id, 'thumbnail', '', array( 'class' => $classes ) );
}