Today I integrated a “SAP Community Network (SCN)” reference banner for all posts that I cross-posted over here at www.inscope.net that looks like this:

Enhancing the single.php file

At first, I updated the single.php file from my theme in the theme folder in order to add the necessary coding to fetch the custom meta tag I introduced ‘SCN_Ref’ and maintain for every post.

<!-- scn ref -->
<?php $refurl=get_post_meta($post->ID, 'SCN_Ref', true); ?>
<?php if (!(empty($refurl))) : ?>
<div class="scn_ref">
<p>SCN Cross-post | Original content can be found <a href="<?php echo $refurl ?>" target="_blank" title="Original content URL" alt="Original content URL">here</a></p>
</div>
<?php endif; ?>

Enhancing the single.php file for WPTouch

While the above worked out like a charm, it failed on smartphones as WPTouch uses it’s own php template in which the meta-tag processing was missing. One of the main (if not THE main) reason to cross-post my blog posts (originally published on SCN/SDN) is the (lack of) mobile rendering over there (at the time of writing). Consequently, I added the same coding above in the single.php located in the wordpress plugin folder.

Adding the necessary CSS information

At last I just added some CSS declarations in the two theme CSS files (one for my theme and one more the WPTouch theme). Below is the relevant coding:


.scn_ref{
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#F0AB00 url(images/scn_ref3.png) no-repeat scroll left top;
min-height:37px;
padding:5px;
padding-left:15px;
border:1px solid white;
margin:0.5em 0;
}
.scn_ref p {
margin:14px 0 0 22px;
color:#FFFFFF;
font-weight: bold;
font-size: 100%;
}


The result