[Leslie Anderson]

Hello,

I have looked for the CSS to change social links opening in a new window/tab to open in the same window/tab.

I actually want to jump to a bookmark in my widget on the same page from which the FB icon was pressed. I think it worked before version 4.1.1.

I tried this custom CSS, but it does not work:

.social-profile ul li a[target=”_self;”]

My destination URL is

https://www.pflagannapolis.org/meetings-and-events/#fbjump

which I want the FB icon at the top of the page to jump within on the same page in the same window/tab.

Thank you in advance for any assistance.

[Mahesh]

@lambanlaa: This is not possible with CSS. For this, you’ll need to create a child theme. You can find more details on creating child theme HERE. Then in your child theme’s functions.php add the following CSS.

if ( ! function_exists( 'catchresponsive_child_invalidcache' ) ) :
/**
 * Template for Clearing Cache
 *
 */
function catchresponsive_child_invalidcache() {
	delete_transient( 'catchresponsive_social_icons' );
} // catchresponsive_child_invalidcache
endif;
add_action( 'after_setup_theme', 'catchresponsive_child_invalidcache' );

function catchresponsive_get_social_icons(){
	if ( ( !$output = get_transient( 'catchresponsive_social_icons' ) ) ) {
		$output	= '';

		$options 	= catchresponsive_get_theme_options(); // Get options

		//Pre defined Social Icons Link Start
		$pre_def_social_icons 	=	catchresponsive_get_social_icons_list();

		foreach ( $pre_def_social_icons as $key => $item ) {
			if ( isset( $options[ $key ] ) && '' != $options[ $key ] ) {
				$value = $options[ $key ];

				if ( 'email_link' == $key  ) {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_blank" title="'. esc_attr__( 'Email', 'catch-responsive-pro') . '" href="mailto:'. antispambot( sanitize_email( $value ) ) .'"><span class="screen-reader-text">'. __( 'Email', 'catch-responsive-pro') . '</span> </a>';
				}
				elseif ( 'skype_link' == $key  ) {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_blank" title="'. esc_attr( $item['label'] ) . '" href="'. esc_attr( $value ) .'"><span class="screen-reader-text">'. esc_attr( $item['label'] ). '</span> </a>';
				}
				elseif ( 'phone_link' == $key || 'handset_link' == $key ) {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_blank" title="'. esc_attr( $item['label'] ) . '" href="tel:' . preg_replace( '/\s+/', '', esc_attr( $value ) ) . '"><span class="screen-reader-text">'. esc_attr( $item['label'] ) . '</span> </a>';
				}
				else {
					$output .= '<a class="genericon_parent genericon genericon-'. sanitize_key( $item['genericon_class'] ) .'" target="_self" title="'. esc_attr( $item['label'] ) .'" href="'. esc_url( $value ) .'"><span class="screen-reader-text">'. esc_attr( $item['label'] ) .'</span> </a>';
				}
			}
		}
		//Pre defined Social Icons Link End

		//Custom Social Icons Link Start
		for( $i = 1; $i <= $options['custom_social_icons'] ; $i++ ) {
			$has_hover 		= '';
			$image_hover 	= '';

			if ( ! empty( $options['custom_social_icon_image_'. $i] ) ) {
				$image = $options['custom_social_icon_image_'. $i];

				if ( ! empty( $options['custom_social_icon_image_hover_'. $i] ) ) {
					$image_hover = $options['custom_social_icon_image_hover_'. $i];
					$has_hover = " has-hover";
				}

				//Checking Link
				if ( ! empty( $options['custom_social_icon_link_'. $i] ) ) {
					$link = $options['custom_social_icon_link_'. $i];
				} else {
					$link = '#';
				}

				//Checking Title
				if ( !empty ( $options['custom_social_icon_title_'. $i]) ) {
					$title = $options['custom_social_icon_title_'. $i];
				} else {
					$title = '';
				}

				//Custom Social Icons
				$output .= '<a id="custom-icon-'. $i .'" class="custom-icon' . $has_hover . '" target="_blank" title="' . esc_attr( $title ) . '" href="' . esc_url( $link ) . '">
					<img  alt="' . esc_attr( $title ) . '" class ="icon-static" src="' . esc_url( $image ) . '" />';

					if (isset ( $image_hover ) && '' != $image_hover ) {
					$output .= '<img  alt="' . esc_attr( $title ) . '" class ="icon-hover" src="' . esc_url( $image_hover ) . '" />';
				}
				$output .= '</a>';
			}
		}
		//Custom Social Icons Link End
		set_transient( 'catchresponsive_social_icons', $output, 86940 );
	}

	return $output;
} // catchresponsive_get_social_icons

Regards,
Mahesh

[Leslie Anderson]

So, I figured. Thanks so much for the functions.php code. I did already create a child theme. 😉

[Author]

Posts