Social Media links don't have rel="noopener" - Support | Kriesi.at

Tagged: lighthouse, social profiles

Viewing 23 posts - 1 through 23 (of 23 total)

Author

Posts
January 27, 2018 at 12:28 pm #903651

kaylanx
Participant

Hello

I was using Google Chrome’s Lighthouse (https://developers.google.com/web/tools/lighthouse/#devtools) to run an audit of my WordPress site (using your excellent Enfold theme)

It showed up that the social media links generated by social profiles in Enfold do not add rel="noopener"

https://developers.google.com/web/tools/lighthouse/audits/noopener

It showed a few different issues to be fair, it might be worth you guys running it and seeing what you can fix.

Thanks

Andy

January 30, 2018 at 6:45 am #904634
Ismael
Moderator
Hey kaylanx,

Thank you for using Enfold.

You can use the following script in the functions.php file to apply a rel attribute to the social media icons.
```
add_action('wp_footer', 'ava_custom_script');
function ava_custom_script(){
	?>
	<script type="text/javascript">
	(function($) {
		function a() {
			$('#top #wrap_all .social_bookmarks li a').each(function(){
			  $(this).attr('rel', 'noopener');
			});
		}
		
		a();
	})(jQuery);
	</script>
	<?php
}
```
Best regards,
Ismael
June 11, 2018 at 5:10 pm #971300
Pako
Participant
Hi,

thanks for the answer. I had the same question.

Unfortunately the test reports same issue again, so the script won´t work maybe. May social buttons are next to main menu. I i remove them, the message disappears.

Regards
- This reply was modified 6 years, 6 months ago by Pako.
June 12, 2018 at 7:39 am #971556

Ismael
Moderator

Hi,

Did you purge the cache after adding the script? Please provide a link to a page with the social media links.

Best regards,
Ismael

June 12, 2018 at 4:23 pm #971724
Pako
Participant
Hi, yes cache was cleaned before. Adress is Werk32.NET The icon is located in the upper right corner (Youtube Symbol).
- This reply was modified 6 years, 6 months ago by Pako.
June 13, 2018 at 3:47 am #972019

Ismael
Moderator

Hi,

My fault. I didn’t notice that the filter was commented out. It was actually disabled. Please try the code again.

Best regards,
Ismael

June 13, 2018 at 11:01 am #972217

Pako
Participant

Hi same behavior. :(

June 14, 2018 at 4:22 am #972595

Ismael
Moderator

Hi,

Thanks for the update.

We would like to test the script. Please provide the WP login details. Make sure that the Appearance > Editor panel is accessible.

Best regards,
Ismael

June 19, 2018 at 6:06 pm #974844

Pako
Participant

This reply has been marked as private.

June 20, 2018 at 5:41 am #975086

Ismael
Moderator

Hi,

Thanks for the update.

The “wp-admin” and “wp-login” path leads to a 404 page. I also tried “login”. What is the actual login url?

Best regards,
Ismael

June 20, 2018 at 6:56 am #975115

Pako
Participant

This reply has been marked as private.

June 20, 2018 at 7:16 am #975123

Ismael
Moderator

Hi,

Thanks for the update.

We implemented the code and confirmed that the social icons have the rel attribute set to “noopener”.

Best regards,
Ismael

June 20, 2018 at 8:15 am #975139

Pako
Participant

Awesome! Will it stay after an update?

June 20, 2018 at 12:28 pm #975241

Victoria
Inactive Moderator

Hi Werk32,

If the code is in the child theme functions.php it will, otherwise it will be lost.

If you need further assistance please let us know.
Best regards,
Victoria

June 20, 2018 at 12:34 pm #975245

Pako
Participant

Hi. Are you able to move the code to the child theme. I am unsure that i take the right part of the code.

June 20, 2018 at 9:05 pm #975474

Victoria
Inactive Moderator

Hi Werk32,

This function needs to be moved to the child theme.

How to Install Enfold Theme

If you need further assistance please let us know.
Best regards,
Victoria

June 20, 2018 at 10:04 pm #975508

kaylanx
Participant

I got around this by using the Real Time Find and Replace plugin:

https://wordpress.org/support/plugin/real-time-find-and-replace

I added the find as target='_blank' and the replace as target='_blank' rel='noopener'

However, the reason I initially raised this issue wasn’t for a work around like mine or like the code change you have suggested. It was to point out that there is an issue with Enfold that needs to be fixed in a release of the the theme, not patched by the end users of your theme.

Thanks

Andy.

June 21, 2018 at 3:22 am #975613

Ismael
Moderator

Hi,

Thanks for the info. We’ll forward this to the team. :)

Best regards,
Ismael

June 21, 2018 at 3:22 am #975614

Ismael
Moderator

Hi,

Thanks for the info. I’ll forward this to the team. :)

Best regards,
Ismael

September 23, 2018 at 9:51 am #1013258

Neverlands
Participant

Hello,
I also would like to add a function for the “Advertising Area” widget links – how would I have to modify the function?

<a target="_blank" href="https://www.domain.com/" class="preloading_background avia_partner2 link_list_item1 ">...</a>

Best regards,
Neverlands

September 23, 2018 at 10:03 am #1013260
Dude
Participant
Hi,

Please add this code to your child theme functions.php – it will add the noopener attribute to all partner widget links:
```
function avia_add_noopener_to_links(){
?>
<script type="text/javascript">
(function($) {
$('.avia_partner1, .avia_partner2').each(function(){
	var a = $(this);
	var originalRel = (this.rel === undefined) ? '' : this.rel.toLowerCase();
	var newRel = originalRel.split(" ");
	if (originalRel.indexOf('noopener') === -1) newRel.push('noopener');
	a.attr('rel', newRel.join(" ").trim());
});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'avia_add_noopener_to_links');
```
Best regards,
Peter
September 23, 2018 at 5:57 pm #1013375

Neverlands
Participant

Hi Peter,

it works – many thanks!

Best regards,
Neverlands

September 23, 2018 at 6:37 pm #1013383

Dude
Participant

Hi!
Great, glad I could help you :)

Regards,
Peter
Author

Posts