Docs    Facebook    Customizations

Changing the size of the Facebook author avatar

The standard size of the Facebook author avatar is 40px but this can be increased by using the following snippets.

Add the following JavaScript to your site. This can be done manually using a custom JavaScript plugin. For further information see our documentation here.

$('.cff-author-img img').each(function(){
  $(this).attr('src', $(this).attr('src') + '&width=150');
});

You can change the size by altering the “150” value at the end of the second line.

Next, add the following CSS to your preferred custom CSS location or stylesheet. One option is the default additional CSS location found at WordPress Dashboard > Appearance > Customize > Additional CSS.

#cff .cff-author-img {
  width: 150px;
  height: 150px;
  background: none;
  border-radius: 50%;
}
#cff .cff-item .cff-author-img img {
  width: 150px;
  height: 150px;
  border-radius: 50%;
}
#cff .cff-author .cff-page-name, #cff .cff-author .cff-date {
  margin-left: 160px !important;
}
#cff .cff-author .cff-page-name.cff-author-date {
  padding-top: 60px;
}

The 150px values should match the size of the image you specified in the first snippet. The 160px value should be 10px more than the size you specify.

Technical Support

Still have questions? We are here to help you succeed.

Open a support ticket