need help with website layout.

  • 1
  • Question
  • Updated 10 years ago
  • Answered
hey, i was wondering if i could get things like this box that contains articles in it,
http://www.gamesradar.com/

please help, is it HTML coding? are there ones you can get as a widget?
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
  • frustrated

Posted 10 years ago

  • 1
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hello Dbomb!

Are you talking about the "Latest News from Edge"? Or the "Top Stories?"
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Hello Dbomb,

Can you be more specific about what you are wanting to do. If you could give us a screen shot the the exact area of that site you are trying to replicate I am sure we can give you some ideas.

Kind Regards,
Emmy
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
thanks, im referring to the top stories and the animated box above it.
Photo of Crewcaptain

Crewcaptain

  • 12 Posts
  • 0 Reply Likes
The animated box is a flash movie(s).
The Top Stories are a collection of images set in placeholders (Image or text widgets) and linked to their respective pages or offsite links.
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
hmm....

is there an easy way for a noob to do something easy such as the top stories?
Photo of Crewcaptain

Crewcaptain

  • 12 Posts
  • 0 Reply Likes
Yes there is Dbomb.

You can drag a two column widget onto your page from the sidebar. Then put another one of the same into one of the columns of the first. You can repeat this for as many columns as you need.

The next thing is to drag text widgets into each of these columns. Then add an image into each of these text placeholders. Place your image into the appropriate space and make a link from the image to the place that has the expanded information.

That's it in outline.
Photo of Emmy

Emmy

  • 5892 Posts
  • 299 Reply Likes
Great answer Crewcaptain! The two column widget is by far my favorite!
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
thanks! ill try this out
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
heyyy i tried this out for the home page!

do you guys know how to make a image link to the page with the article on it?

or how to make a page of article names you can click to go to the article?
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hi Dbomb

To make an image link, try the following:

Drag an image widget from the right-hand side under content to where you want it on your site. Select an image from either your computer or from your file manager. Make sure there's a red line around your image - this means the image is selected. Then, click on Properties on the right-hand side and scroll down until you see "Link". Click on "choose a link" and a pop-up box will come up. Select which one pertains to you and type in the url. and then press "ok". That's should be it! =)
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
Linking an image is straight forward Dbomb. because there are two ways of installing images with the Yola builder I will describe both:

If the image has been inserted with the image widget then click the image in the widget, and go to your builder sidebar, properties manager, scroll down to the "Choose a link" button and click it. A new dialogue box will open giving you four options. Select the page that you want to link to.Click OK and you're done with that one.

If the image has been inserted into a Text widget then youRight click and drag your mouse over the image. It will turn blue colour. If you look further towards the top of the page you will see the text editor tool bar . In the fourth group of tools from the left you will notice a chain link icon. Click this and a link editor will open similar to that described above. the process now is identical.

For a page of article names , a list, you can go to each item and highlight it with your mouse byRight clicking and hold while dragging the mouse over the word(s). If you look up further towards the top of your screen you will notice your text tool bar. In the fourth group from the left of that bar you will see a small icon that looks like a single chain link. Click that and the same editor we described previously will appear. If the article is a dedicated page then simply select the page link and locate the page name. Click OK and once again you're fine.

If the article is buried in the middle of a page then this involves fairly sophisticated HTML working. These types of links use anchors and I will post the reference for anchor subsequently on this thread.

Good luck Dbomb.
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
Dbomb here is the link for the Anchors. It should be prcticed on a trial site first.
http://tipsandtricks.synthasite.com/A...
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
WOW!

you guys own! thanks! ill show you my site... later, just for a display of what im using thiese for.
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
Looking forward to it!
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
ill show you after i figure something out... how can you add a border to a text box?
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Here you go Dbomb! Just be sure to take out the <!-- and -->. You customize it to your liking. You can change the Hex color, the type of line (e.g. solid, dashed), the thickness of the border... have fun!

<!--<div style="width:281px;height:211px;border:2px solid #FF5200;">Text here</div>-->
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
Hi Dbomb,,

Here is an almost universal four sided frame to put anything in:

<!--<table border="3" bordercolor="#FFB873" style="background-image:url(http://yoursite.com/resources/{folder..." : width="800" cellpadding="25" cellspacing="2">
<tr>
<td width="100%"><STYLE TYPE="text/css">
BODY
{
text-align:{justify}{center}{left}{right};
}
</STYLE>your text here </td>

</tr>
</table>
-->

Colour, border width space between the edge, everything is adjustable.
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
where it says justify, is that where i put my text?

does it matter if its a link?
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
For a link you can also use it. get back to if you need some direction.
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
insanegamer.synthasite.com

its laaaaame.

but its for fun, im not really taking it seriously
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
Dbomb,

You can type your text or paste with Notepad into the part that says. "your text here"

The justify, center, left, right are alignment options. just choose one for your text alignment.
Photo of Peter

Peter

  • 2569 Posts
  • 113 Reply Likes
It's a great website Dbomb.

I hope you are enjoying making it :)
Photo of Dbomb

Dbomb

  • 10 Posts
  • 0 Reply Likes
ahh.
ill try it out,

and thanks =] it is so far.