• Advertisement
  • Popular Tags

  • Popular Now

  • Advertisement
  • Similar Content

    • By kin kita
      Hello GameDev!
      This is an introduction to a new web app: Vitalkia.com. homepage - Vitalkia
      Making silly games and sharing them with friends and people online is something that is really special to me. When I was 13-14 I used to hang at various game forums a lot. I didn't really make any amazing games, but that didn't matter. What makes us love making games is sharing it with others and learn. Because of this, as a side project while I study, I've been making a new game creator tool. It lets you create cool games completely in your browser. This app will help you creating games!
      I've recently created a simple interactive tutorial that takes you step by step through creating a platform game:
      Platform tutorial
      This tutorial will teach you how to make a simple platform game and introduce you to the app.
      So far it's still very early in development, but it's very possible to create great looking games, here is an example.
      More info:
      The app lets you create games anywhere, anytime. Since it's cloud based, it doesn't matter which computer you use. All code and resources gets stored in your own personal web space associated with your account. Your account can be from Google or a new Vitalkia account if you want.
      You don't need to know how to code. The engine allows for direct Javascript coding but also the use of code blocks. The code blocks makes it easy to quickly create something that works.
      After you've created your game you can easily export it. It makes it directly available to everyone with an internet connection!
      There are still many things to do. For example more code blocks needs to be added, and some bug fixes, but I am looking forwards the future of the app and what people will be able to create with it!
    • By Nicolas Lorusso
      Hello, i've made a game for Android, however to reach more users i made a Web adaptation which i published first in itch.io. After that, i've seen that the number of users has been incrementing a lot in comparision to Android. Doing some research i saw that the game is getting published in several web networks. I felt really frustrated since none of that networks ever contacted me for a permission for publishing the game and/or sharing revenue. I've been trying to contact people from those networks to make business but the requests are so slow or never answered,
      Is this something normal in web platform? What would you recommend me to do?
    • By Dead Chronicles
      Demo version in HTML5
    • By Lode
      I'm working on a tile based engine in HTML5+canvas.
      I currently made every single tile in the world its own little canvas. The reason is, I make two canvases per tile, and depending on state display one of the other. This allows fast switching between the two with style.display.visiblity.
      However, while that actual showing and swapping visibility goes fast, what goes slow is creating them at the start of the game, in Firefox at least. In Chrome, this all goes super fast. In firefox, simply creating a couple of thousand canvases, especially calling getContext('2d') on each of them, goes super slow.
      Is there any alternative better way to have a 2D tile based engine where each tile can efficiently swap between two different graphics?

    • By Questengine
      Hey Everyone, I was part of this community 10 years ago. I made a game that Steve Pavlina at Dexterity published and almost no one bought. 
      I'm a programmer, I like to build stuff and HATE to market and sell stuff.  If you want to take my product and make a pile of money with it, I'll split it with you 50/50.  
      I owned picross dot com for several years before Nintendo took it from me.  All I was left with was a few thousand user-made nonogram puzzles in my database. I've been trying to do something with them, but again, I'm not a business person.
      So I've made a mobile friendly html5 page with a version of picross and it's pretty much complete, if you can monetize it I'd love to have your help.
      But picross games on mobile suck right?  Because there's too many little things to tap and too much zooming in and out!  Not with my game. I automatically fill in every other cell in the puzzle, then highlight the unsolved cells one at a time and the user need only select "mark" or "blank".  You still have to use picross-like logic, but it's faster and the UI is far simpler. 
      So this thing already exists, you can play it here http://www.questengine.com/quickcross/ I think it only responds to touch events so it may not work on a full desktop browser with mouse clicks.  There's a google adsense ad that pops up after each puzzle, but please ignore it, I'm not trying to get clicks, I seriously want a person who's good at building business relationships and who's just looking for a product to work around.
      Hope you'll have a look, thanks.

  • Advertisement
  • Advertisement
Sign in to follow this  

HTML5 RSS Feed w/ matching style?

Recommended Posts

Since the general programming forum was nixed, I hope that it's still okay to post such a question here.  Mods, if it doesn't belong here, feel free to move it.  Thanks.

Since I am not a web developer, I am having trouble getting this automatically generated RSS feed to match the style of my webpage.  What I used was a pre-written template and went from there.  So to be honest, I don't know jack crap about CSS, but I understand the basics of HTML (I need to be more like fastcall22).  This is the code to my RSS feed that rssdog generated:

<iframe width="100%" height="750" class="rssdog" src="http://www.rssdog.com/index.htm?url=http%3A%2F%2Fblog.shogun3d.net%2Ffeeds%2Fposts%2Fdefault%3Falt%3Drss&mode=html&showonly=&maxitems=5&showdescs=1&desctrim=0&descmax=0&tabwidth=100%25&showdate=1&linktarget=_blank&textsize=small&bordercol=%23000000&headbgcol=%23000000&headtxtcol=%23ffffff&titlebgcol=%23000000&titletxtcol=%23ffffff&itembgcol=%23000000&itemtxtcol=%237f7f7f&ctl=0"></iframe> 


For those of you that need it, this is a link to the website that generated it: http://rssdog.com/

And last but not least, this is a link to my website: http://shogun3d.net

Since I'm getting ready to make a submission of my game to id@xbox, I really would like to have my blog used to display project updates and so on.  I know, I'm really anal about stuff like that, but I want to make the best impression I possibly can because as a poor indie without a dime in his name and one paycheck away from losing everything, I have little to no room for error.

Any ideas?  Thanks.


Share this post

Link to post
Share on other sites

There are some non–obvious problems with this setup, but let’s cover some CSS basics first.

Every HTML element has a set of properties that describe how it should be laid out on a page and how it should rendered. They can be accessed with it’s style property in Javascript. You can write Javascript or add a style attribute to each HTML element to give your page the look and feel, but it quickly becomes tedious and cumbersome. Enter CSS. It allows you to apply styles to elements determined by rules. These rules can even be stored in a separate file, so you don’t have to clutter your HTML. Here’s a CSS cheatsheet. Now, on to style matching.

If you want to match styles, then open your browser’s developer tools and inspect random elements on the page. Poke at their CSS properties and find out what they’re made of. Take note of font-family, font-size, line-height, color, background, padding, and margin properties as they are a significant chunk of the look and feel.


Next, let’s talk about RSS. When querying an RSS feed, you are met with an XML document with a summary of recent posts. Here’s an example RSS feed. The problem is that this XML isn’t usable HTML. It will need to be transformed into HTML. You’ve opted to use rssdog.com do this for you. The query string parameters you pass to rssdog tells it which RSS feed to fetch and how to render that HTML, along with some basic styling. By using an iframe tag with this URL, the user’s browser will make a separate request on your homepage to rssdog with your parameters and rssdog will fill that space with the resulting HTML. Browsers are particular about cross–domain interactions for good reason, so while this iframe is a part of your homepage, it is a considered a separate web page and has protections against modification. More on this later.


So, options at this point:

  1. Render the XML yourself, server side. This is the easiest option as you can embed the resulting HTML directly into your page and you can retain your styling. You will need to research what server side languages are available with your web hosting provider. You will then need insert a server side script on your homepage that will download the XML from the RSS feed (using CURL, for example), traverse the resulting XML document, and render the HTML.

  2. Render the XML yourself, client side. Include some Javascript to invoke an XHR request to your feed, receiving the XML, and dynamically creating HTML elements from it. This requires that the server send a Access-Control-Allow-Origin header to grant access from shogun3d.net to blog.shogun3d.net.  Check your web hosting provider on how to send that header. After enabling the option, use the network tab on your developer tools to ensure that the header was sent. (Be sure to hard refresh to prevent your browser using a cached version of the page and headers.) The theme you have selected has jQuery included, so you can use jQuery.ajax to fetch your XML. Otherwise, you can use a raw XMLHttpRequest.

  3. Manually sync your homepage with your blog. This is the most annoying option.

Share this post

Link to post
Share on other sites

Wow, this is more complex than I thought!  It's times like this I wish I could just pay someone to do it for me.  But either way, I will get it done, one way or another because it's gotta get done.

I'll be honest here, I don't know jack crap about server side, jQuery, ajax, etc.  I only know about HTML5, Javascript and XML.  Everything else you said is like greek to me, so I'll have to take some online courses.

Thanks fastcall!


Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Advertisement