Custom Sidebox for the UpFront Badge

[Dovecam]

Hey, everyone!

I want to customize a sidebox for the UpFront on the basis of blank sidebox and get a verification from theFind.com.

They require me to add the following code in the page. I tried serveral times in my customized sidebox but serious error occurred (Website content can NOT be displayed).

Can somebody give me any instruction on how and where to add these code in the sidebox on the basis of black sidebox?

<a class="tf_upfront_badge" href="http://www.thefind.com/store/about-vostrostone" title="TheFind Upfront"><img  border="0" src="//upfront.thefind.com/images/badges/templates/s_badge.png" alt="Vostrostone Online Shop is upfront"/></a>
<script src="//upfront.thefind.com/scripts/main/utils-init-ajaxlib/upfront-badgeinit.js" type="text/javascript"></script>
<script type="text/javascript">thefind.upfront.init('tf_upfront_badge', '59a9c7eb0b17f4b47b0c82fe7fbeab4d')</script>

Many Thanks!

[rowanwa]

Hi, I suppose the code would resemble the following:

<?php
// -----------------------------------
// MY CUSTOM SIDE PANEL ITEM
// -----------------------------------

  // test if box should be displayed
  $show_CUSTOM_NAME = true;

  if ($show_CUSTOM_NAME  == true) {
      ?>
            
      <div align="center" style="padding:5px;">
        <a class="tf_upfront_badge" href="http://www.thefind.com/store/about-vostrostone" title="TheFind Upfront"><img  border="0" src="http://upfront.thefind.com/images/badges/templates/s_badge.png" alt="Vostrostone Online Shop is upfront"/></a>
<script src="http://upfront.thefind.com/scripts/main/utils-init-ajaxlib/upfront-badgeinit.js" type="text/javascript"></script>
<script type="text/javascript">thefind.upfront.init('tf_upfront_badge', '59a9c7eb0b17f4b47b0c82fe7fbeab4d')</script> 
      </div>
            
      <?php }
?>

I noticed that in your code you missed out the http: in a few places, so I added them in. That may have been the source of your original problem.

Save the file as CUSTOM_NAME.php (replacing CUSTOM_NAME with your own name, providing it is consistent with the one used in the page code). Upload the file into the includes/modules/sideboxes/ folder. Then log into admin, and select Tools -> Layout Boxes Controller to manage your new feature. You can select which column to display it within, along with its sort order, just like any other module.

Hope this helps!

[Dovecam]

Rowanwa,

Thank you for your support!

I have tried your code but side column content can NOT be displayed within a box.

I'd like to use blank sidebox to do it then where should these cold be placed?

Thanks!

[commdiver]

Has anyone figured this out? I too cannot get it to work.

[commdiver]

I tried using the absolute sideboxe mod as opposed to the blank sidebox, but that did not help either. Can javascript not be shown in sideboxes or is it a problem with the code itself? Here is mine:

<a class="tf_upfront_badge" href="http://www.thefind.com/store/about-queencharlottesoaps" title="TheFind Upfront"><img  border="0" src="//upfront.thefind.com/images/badges/s/be/af/beafb4d42adec8708fadf0913dce387e.png" alt="Queen Charlotte Soaps, LLC is upfront"/></a>

  <script type="text/javascript">
  (function() {
      var upfront = document.createElement('SCRIPT'); upfront.type = "text/javascript"; upfront.async = true;
			upfront.src = document.location.protocol + "//upfront.thefind.com/scripts/main/utils-init-ajaxlib/upfront-badgeinit.js";
			upfront.text = "thefind.upfront.init('tf_upfront_badge', 'beafb4d42adec8708fadf0913dce387e')";
      document.getElementsByTagName('HEAD')[0].appendChild(upfront);
    })();
  </script>

[yarho]

Try putting a \ in front of each ' in the function. This worked for me:

<script type="text/javascript">
(function() {
var upfront = document.createElement(\'SCRIPT\');
upfront.type = "text/javascript";
upfront.async = true;
upfront.src = document.location.protocol + "//upfront.thefind.com/scripts/main/utils-init-ajaxlib/upfront-badgeinit.js";
upfront.text = "thefind.upfront.init(\'tf_upfront_badge\', \'b0dc335eff97b1a87cb3ea73b0c1bb00\')";
document.getElementsByTagName(\'HEAD\')[0].appendChild(upfront);
})();
</script>

[commdiver]

If anyone else is still having problems with this, take a look at this thread I posted. That is how I did it. Create a javascript file, as per the first tutorial, include UpFront's JavaScript in that file, and post the UpFront HTML into the sidebox content area.

[icecold]

If anyone else is still having problems with this, take a look at this thread I posted. That is how I did it. Create a javascript file, as per the first tutorial, include UpFront's JavaScript in that file, and post the UpFront HTML into the sidebox content area.

I did the badge the same way, but every time I try to verify the site at TheFind.com, their script CAN't find the badge ...

Did you actually got verified?

[icecold]

I did the badge the same way, but every time I try to verify the site at TheFind.com, their script CAN't find the badge ...

Did you actually got verified?

BTW I finally got verified, the problem was my site is in a subdirectory therefore their script can't find the code. Now I have the Upfront Badge, and I was manually verified by The Find.

As far as Zen-Cart code goes, I had no problems using a modified version of the sidebox and calling javascript code from a file.