Cannot display border

[itsumonotakumi]

I always use this plugin with "no_iframe" option, because this plugin cannot display with border by default.
Since my blog's background is white, my blog can not distinguish between a toot and my sentence without a border by iframe mode of this plugin. I'm in trouble..

Is it correct behavior that border is not displayed by this plugin in the first place?
Do this plugin have something options to change the color scheme of the border or background?

[ginsterbusch]

No, the plugin is currently without custom settings. But that wouldnt be available anyway.
It's thought for advanced users, who have at least a bit of CSS and HTML knowledge.

To change the appearance of a toot, you need to adjust the CSS according to your needs. A reverse-engineered CSS file (from the CSS of the web mastodon instances) is included with the plugin (mastodon-embed.css)

NOTE: You shouldn't change the file directly though (to avoid update issues), but either copy to your theme directory or copy + paste it into the main CSS file of your theme (normally style.css, but might be different).

In both cases, you need to adjust the CSS url call of the plugin afterwards. To do so, add the following lines to the functions.php file of your theme:

if( !function_exists( '_my_theme_override_toot_css' ) ) :
	add_filter( 'mastodon_embed_content_style', '_my_theme_override_toot_css' );
	
	function _my_theme_override_toot_css( $url = '' ) {
		$return = get_template_directory_uri() . 'mastodon-embed.css';
		
		return $return;
	}


endif;

1. Replace 'my_theme' with the prefix of your theme (or any other you prefer).
2. In the case where you copied + pasted the original CSS into the theme CSS file, you need to replace the line with '$return = ...' with $return = '', which is supposed to automatically disable the inclusion of the original CSS (at least that is how I programmed it)

[itsumonotakumi]

Thank you for your great advice! I'll try this soon.

But I hope this plugin will be implemented this function.

[ginsterbusch]

That is not the purpose of this plugin, ie. custom styling etc. It's providing lots of options to simply embed a toot, a toot conversation or a single pick out of a conversation.

Custom styling via a GUI would either mean adding a rather complex admin screen OR even worse, having to use the Customizer, which I wont. The idioticy called Theme Customize(r) nearly led me to a severe burnout 2 years ago, so its a total no-go (also, its a nasty resource hog and its usability is rather bad) :)

But: I'm going to add a wiki with a documentation of the built-in filters and hooks to this github repository in the near future, so anybody who likes to take it up and create a "clicky-clicky customize me colors" interface, is welcome to do so :)

[ginsterbusch]

Also note I'm going to add the missing border to the default CSS. I've also added a filter to be able to use a dark colored theme in the future as well.

There are also plans for a settings / admin screen, but only for doing some default settings for the shortcode, eg. always direct embedding, or always iframe with a height of 300 and a width of 600 pixels etc.