Lots of people want to put Storynory on their own sites. Well here’s how. All you have to do is copy and paste a few lines of code onto your site, say ABRACADABRA ! and our latest stories will appear there by magic like this.

The output should adapt itself to the proportions and style of your site. It should even fit into your sidebar. For tips on styling it further with CSS, keep reading down this page.

The Code

By using our syndication service you agree to our terms and conditions.

Copy and paste the following lines into the code / html window of your site editor. (Not into the “visual” window). This will output our latest three stories.

<script type="text/javascript"
src="http://storynory.net/syndicate/swfobject.js">
</script>
<script type="text/javascript"
src="http://storynory.net/syndicate/output.php">
</script>
<p><a href="http://storynory.com">
Stories by Storynory</a></p>

If you just want one story to output, copy and paste the following:

<script type="text/javascript"
src="http://storynory.net/syndicate/swfobject.js">
</script>
<script type="text/javascript"
src="http://storynory.net/syndicate/output_single.php">
</script>
<p><a href="http://storynory.com">
Stories by Storynory</a></p>

Styling with CSS

If you know how to edit your CSS style sheet, you can have more control over the way our stories will appear on your page.

To get you going, here’s some sample CSS.

#storynory {
padding: 0 5px 0 5px;
} 

.storynoryitem {
overflow: hidden;
width: 100%;
 padding: 0 0 20px 0;
border-bottom: 1px black dotted;
margin: 0 0 20px 0;
}

#storynory img {
float: left;
height: 200px;
width: 150px;
}

.storyimage {
padding: 0 20px 20px 0px;
}

#storynory p {
padding: 0 0 20px 0;
}

#storynory h3 {margin: 0 0 10px 0 }

#storynory a {text-decoration: underline }

A few CSS image tips: You can size the images down, as above, via the CSS. If you do, it’s a good idea to keep the img width and height separate from padding and margin (we put padding onto .storyimage). If you haven’t room for any images, make them vanish with with “display: none”. If you float the images to the left or right, they might overflow the item. That’s why we suggest “overflow: hidden; width: 100%;” for .storynoryitem.

Or use our services

If you are a website owner and would like us to to provide a custom solution, please contact us. We usually charge for this service. (Guide Price £250 or $500).

We can also provide syndication solutions for third party RSS feeds - either to fetch and include them on your site, or to provide syndication of your RSS output.