Trumba
Google 
Trumba Help Center What’s New | FAQ | Support Forum | Email Support

FAQs about integrating calendar spuds into your website

This topic answers the most common questions about getting your Trumba® calendar spuds to behave the way you want them to on your site.

Tip If the question you have is not included in this list, please visit our Product Support Forums, where many more spud questions are answered.

Can my spud display a filtered view or specific search results by default?

You can use URL parameters to display your spuds in different views by default, or to create links to customized views of your spuds. To see how, including examples for displaying search results, filtered views, and a different default mix-in state, see Use URL parameters to set calendar views.

Why don't my spuds display on my WordPress blog?

If you try to enter spud code into a post on a WordPress blog that is hosted by WordPress.com, the only thing that displays in your blog is the text for the spud code.

Blogs hosted on WordPress.com do not support JavaScript (which Trumba Connect uses to display spuds), and the WordPress software deletes script tags from your posts. They do this for security reasons, which you can read about on the wordpress.com site and in their support forums.

If you have downloaded the WordPress software from WordPress.org (a different site from wordpress.com) and set it up on your own host, you might be able to use the older version of the spud code to embed spuds, following these steps:

  1. In your WordPress blog, click My Profile, and then uncheck the Use the visual rich editor when writing check box.
  2. Open the post in which you want your spud, and enter a previous version of the Trumba spud code (given below this procedure), substituting the placeholder text with your calendar name, into the Write Post page.

Main calendar spud

<script type="text/javascript" src="http://www.trumba.com/k.aspx?calendar=yourcalendarname"></script>

Mix-in (calendar) list spud

<script type="text/javascript" src="http://www.trumba.com/k.aspx?calendar=yourcalendarname&widget=mix"></script>

For other spuds, for widget=, you simply use the appropriate spud type. You can get the appropriate spud type from the code that Trumba Connect generates for the spud in your Publishing Control Panel. You can also use additional parameters to control the display of the spud if you want.

If you have downloaded the WordPress software, you might also be interested in reading the WordPress documentation about using javascript with their software.

When I click an event in a spud, it jumps to trumba.com. I want it to jump to the calendar page on my own site.

When you use promotion spuds, You can change the destination that spuds jump to by adding or editing a variable in the spud code.

  1. Open the page that contains the spud so that you can edit it.
  2. In the spud code, you might see the following argument:
    teaserBase: "http://www.trumba.com/calendars/calendarname"

    where calendarname is the web name of your published calendar.

  3. If you see this code, replace http://www.trumba.com/calendars/calendarname with the URL of the page on your site that contains your main calendar spud.

    If you do not see the teaserBase argument, add it, and again, replace the URL to your Trumba hosted calendar with the URL of your main calendar page. The following code shows the argument with the upcoming events spud, using placeholder text where your calendar information should go:

    <script type="text/javascript">
    $Trumba.addSpud (
    { webName: "yourcalwebname",
      spudType: "upcoming",
      teaserBase: "URL for your calendar page" });
    </script>

Test your spud by clicking an event. If it's a spud that links to event details, you can click Return to calendarname on the event details page to see the full embedded calendar.

Using older spud code

If your page uses the older spud code, you might want to replace it with the new code that you can find on the related Calendar Spuds, Control Spuds, Promotion Spuds and other tabs in the Publishing Control Panel. Otherwise, in your existing code, immediately preceding the <script> tag that adds the spud, you might see the following code:

<script language="javascript" type="text/javascript"> var trumba_teaserBase = "http://www.trumba.com/calendars/calendarname";</script>

where calendarname is the web name of your published calendar. If you see this code, replace the URL for the Trumba hosted calendar with the URL of your main calendar page, as described in the procedure above.

Back to top

The calendar is wider than the maximum width for my web page's content

If you want to make the calendar fit into a set space that's narrower than the default calendar width, you can place it into a div of the best width and height for your page, and use the overflow attribute to add scroll bars to the div container. For example,

<div style="width:400px; overflow:auto;"> <script type="text/javascript">
$Trumba.addSpud (
{ webName: "yourcalwebname",
  spudType: "spudtype" });
</script>
</div>

Special case: Multi-day template

The Multi-day template requires a width of nearly 800px and currently behaves a little differently than the others. If your calendar uses this template, and you want it to fit into a narrower space, you need to take the code above one step further.

First, you need to create a div for the dimensions you want the calendar to fill on your page. Then you create a second div to hold the calendar. This is what the code looks like:

<div style="width:400px; overflow:auto;">
<div style="width:800px;>
Spud code
</div>
</div>

Back to top

Nothing happens when I click a date in the Date Finder spud

If you embed a Date Finder spud into a page that does not contain your main calendar spud, you need to tell it where to direct visitors when they click a link. To do that, you add the teaserBase argument as described in When I click an event in a spud, it jumps to trumba.com… earlier in this FAQ.

How can I customize the Upcoming Events spud?

In addition to editing the styles for this spud on the Promotion Spuds tab in the Publishing Control Panel, you can do the following:

  • Make the background transparent, so that it picks up the colors of your web page
  • Hide the header, footer, or border

For all the details, see the upcoming event spud's api page.

Caution If you customize styles in the Publishing Control Panel, properties you add to the Upcoming Event spud's code locally override the control panel's styles. Use these properties only if you want to style a particular instance of the spud differently.

Back to top

I published a calendar with mix-ins. Can my promotion spud display events from only one of the calendars?

You can do this, but it's slightly tricky. Here are the steps you need to take:

  1. Publish Calendar A with the mix-in. Calendar A will show all events, and you embed the main calendar spud for this calendar combination into your site.
  2. Publish separately the calendar that has the events you want to appear in the promotion spud (Calendar B).

    Because you cannot publish a calendar more than once, if you want to display events from Calendar A in the promotion spud, you will need to start with step 1 again, publishing a different calendar with Calendar A and any others mixed in. The key is that whatever calendar you want in the spud needs to be published by itself and mixed into the main calendar.

  3. Embed the promotion spud for Calendar B, but in the spud code, change the value of the teaserBase variable to show the URL for the page in which you embedded Calendar A (the calendar with the mix-ins).

    Because Calendar A has Calendar B's events mixed in, events from Calendar B's spud can jump to the event details that are mixed into Calendar A.

Back to top

Can I put promotion spuds from two different calendars on the same page?

The procedure for this is similar to getting a spud to display events from only one calendar that's mixed into your published calendar. You can do this only if the spuds you want to display are from calendars that are also mixed into your main published calendar:

To do it, you need to:

  1. Publish Calendar A with Calendar B mixed into it (this will be referred to as Calendar A throughout the rest of this procedure).
  2. Embed Calendar A's promotion spud into your page using the default code.
  3. Also publish Calendar B by itself with no mix-ins (if you don't want people to find it by itself, you can make it unsearchable in the Publishing Settings page).
  4. Embed Calendar B's promotion spud into your page, but change the teaserBase variable to point to the URL for the page on your site that contains the main calendar spud for Calendar A (which has Calendar B mixed into it).

On your web page, each of the two spuds shows events from its own calendar. When you click an event on either spud, it jumps to Calendar A, but events from either spud can display, because Calendar B is mixed into Calendar A.

Back to top

Can I publish the same spud on multiple web pages with different settings or styles?

With both promotion and control spuds, you have the option of creating multiple copies of the same spud for use on either different pages or the same page. Each copy can use different settings to meet your needs.

To do it, you need to:

  1. Publish a calendar.
  2. Add a promotion or control spud.
  3. Add the same spud again. When you select the spud to add it, you will need to provide a unique name for the spud (the default name is SpudConfig2).
  4. Customize each copy of the spud as needed.
  5. Embed each copy of the spud wherever you want to use it.

On your web page, each copy of the spud shows events from the same calendar using the specific settings selected for that spud.

Back to top

Do I have to load the same script file, spuds.js, with each spud?

The short answer is that this script call:

<script type="text/javascript" src="http://www.trumba.com/scripts/spuds.js"></script>

needs to appear only once on each page that contains spuds, before any individual spud code. If you embed multiple spuds on a page, you can put this line of code in the <head> section of your page and then omit it from each individual spud's code.

More info

The script above runs a file called spuds.js. The code in this file oversees communication among spuds on a page and between spuds and your source calendar data on the Trumba server. Without this code, the individual spuds cannot function.

Although you should use this script only once on each page that contains spuds, the code appears with all spuds in the Publishing Control Panel. This is because any of the spuds can function as the only spud on your page, and the code must appear once. Running it multiple times does not harm anything, but it can affect performance. For the second or subsequent spuds on a page, do not copy this part of the code from the Publishing Control Panel.

Privacy | Terms | Public Calendars