Customize Feedzy RSS Feeds by CSS


I’m using a plugin – Feedzy RSS Feeds – to display abstracts of my website.


(In Japanese)

However, Its specification doesn’t match my requirement, so I was using an alternated version of it. The version is developed by me. It accepts some new sort-codes.

Oichinote version of FEEDZY RSS Feeds

The result is as follows.

Feedzy RSS Feedsカスタマイズ

However, the original plugin was updated, then the alternative version has to be updated also. Otherwise, the customize will be never reflected. Feedzy RSS Feeds isn’t an exception. I thought I should update my alternative version.

I made a miss-operation on WordPress, the customize has gone. Then, the display is no good for me without custimize.

Feedzy RSS Feedsノーマル

Can you catch the different? The second photo is zoomed up of its center. Oh, my god! I have to update it.

The point of my customize for Feedzy RSS Feeds is embedding CSS to feedzy-rss-feeds-shortcode.php that displays images.

background-size: contain; background-repeat: no-repeat;

If you customize the plugin, then it is as follows.

--- feedzy-rss-feeds-shortcode.php	2016-01-30 18:25:25.000000000 +0900
+++ feedzy-rss-feeds-shortcode.php.revised	2016-01-30 17:55:37.000000000 +0900
@@ -155,7 +155,7 @@
 						$thethumbnail = feedzy_image_encode( $thethumbnail );
 						$contentThumb .= '<span class="default" style="width:' . $sizes['width'] . 'px; height:' . $sizes['height'] . 'px; background-image:  url(' . $default . ');" alt="' . $item->get_title() . '"></span>';
-						$contentThumb .= '<span class="fetched" style="width:' . $sizes['width'] . 'px; height:' . $sizes['height'] . 'px; background-image:  url(' . $thethumbnail . ');" alt="' . $item->get_title() . '"></span>';
+						$contentThumb .= '<span class="fetched" style="width:' . $sizes['width'] . 'px; height:' . $sizes['height'] . 'px; background-image:  url(' . $thethumbnail . '); background-size: contain; background-repeat: no-repeat;" alt="' . $item->get_title() . '"></span>';
 					} else if ( empty( $thethumbnail ) && $thumb == 'yes' ) {

If I would add the CSS without customizing the plugin, it is happy for me. I found a definition of its class when I analyzed the plugin. I will be able to embed the CSS without customize the plugin.

.feedzy-rss .rss_item .rss_image .fetched {
    background-size: contain;
    background-repeat: no-repeat;

.feedzy-rss .rss_item .rss_image .default {
    display: none;

Please include this CSS your WordPress such as JetPack’s custom CSS. I got a good view as follows.

Feedzy RSS Feedsカスタマイズ

[amazonjs asin="B01B48SKDK" locale="JP"]

Japanese Version of this article is below.

CSSでFeedzy RSS Feedsをカスタマイズ

Posted by お市のかた