Join Listal here 
Existing members 
Login here 
Join Listal to create lists, share images, get recommendations and much more
Avatar
Added by jaytoast

on 29 Dec 2011 12:49

107
2584 Views 25 Comments

Advanced List Editing

Choose file... or enter url:
Sort by: Showing 13 items
People who added this item 8  Average listal rating (5 ratings) 7.2  IMDB Rating 6.8 
1. The Glass Wall (1953)

Creating a Header Type Text



Example:
====================================================

Changing the size of text in the list area



====================================================
Code:
<h3>Changing the size of text in the list area</h3>


This is the only way I know how to change the size of the font. It is actually considered a "Header" text but it works and can be effective if used sparingly.
jaytoast's rating:

People who added this item 27  Average listal rating (18 ratings) 7.1  IMDB Rating 7.3 
2. The Brute (1953)

Even Larger Text



Example:
====================================================

The Brute!



====================================================
Code:
<h2>The Brute!</h2>


Thanks to Mejo ♥♫ for this one.

People who added this item 267  Average listal rating (129 ratings) 6.8  IMDB Rating 6.9 
3. The Quiet Earth (1985)

To Center an Image or Text


Example:
====================================================

New Zealand


====================================================
Code:
<center>New Zealand
[img id=1358394 width=500full]</center>

Any text or image code that you put between the 'center' tags will be centered on the list.
jaytoast's rating:

People who added this item 24  Average listal rating (9 ratings) 7.2  IMDB Rating 6.5 
4. The Amazing Mr. X (1948)

Wrapping Text Around an Image



Example:
====================================================

The Amazing Mr. X (aka The Spiritualist) is an atmospheric 1948 thriller starring Lynn Bari. Bari plays Christine Faber, a young widow who, after two years, is still finding it hard to move on with her life and come to terms with the death of her husband Paul.

====================================================

Code:
[img id=1601633 width=250full align=right]


Note that I changed the image size from the default "width=500full" to "width=250full" this is to give space for the text you want to run along side the image.

You can also use "align=left" if you want the image on the left hand side of the text.

You will want to place the code for the image first. Then type in the text you want to wrap around the image.
jaytoast's rating:

People who added this item 40  Average listal rating (14 ratings) 6.9  IMDB Rating 7.4 
5. Medium Cool (1969)

Image on Right and Left Side


Example:
====================================================


What are we watching?



====================================================
You are going to add image code for adding an image on the left and then the right. The text that appears between the two images should be placed after all your image code.
Code:
[img id=5372108 width=60full align=left] [img id=5372104 width=60full align=right]<center>
<h3>What are we watching?</h3></center>


The tricky aspect to this is getting the images the right size with the text. Here I used the 'h3' code to make the text a little larger and a bit easier to deal with figuring out the size.

Thanks to Holy Godiva and Onion Jack for sharing the 'secret' ;)

People who added this item 63  Average listal rating (32 ratings) 6.4  IMDB Rating 5.4 
6. Citadel (2012)

Putting two images side by side.


Example:
====================================================



====================================================

The notes area is 500 pix wide. When you add an image to to the notes area you are generally using the basic "width=500full' code. To create two images side by side you only need to change "500" to "250". Just make sure there is no space character between the two images.

Code:
[img id=4905239 width=250full][img id=4905240 width=250full]

jaytoast's rating:

People who added this item 213  Average listal rating (104 ratings) 7.6  IMDB Rating 7.7 
7. Jezebel (1938)

Cropping Images
Getting images to be a standard square.


Example:
====================================================


====================================================

Putting images side by side can be simple if and looks best if the two images are the same highth. To get a uniform size and width on an image, change the code from "width=(any size) leaving out the "full" part of the code. Here there are four images with a 250 pix width.

Code:
[img id=519942 width=250][img id=2543593 width=250]
[img id=3583244 width=250][img id=2928253 width=250]


jaytoast's rating:

People who added this item 65  Average listal rating (23 ratings) 7.3  IMDB Rating 7.1 
8. The Young Poisoner's Handbook (1995)

Creating An Image That is a Link



Example:
====================================================

Here is the "Black Comedy" list...



===================================================

Code:
<a href="http://www.listal.com/list/black-comedy-pumpkinate">[img id=1453990 width=250full link=false]</a>

You are using a basic anchor link and using the image code for Listal but the important aspect is adding "link=false" to the image information. If you don't clicking on the image will just take you to the where the image is located on Listal.
jaytoast's rating:

People who added this item 23  Average listal rating (8 ratings) 5.6  IMDB Rating 4.2 
9. Shadows & Lies (2010)

Linking to Video



Example:
===================================================
James Franco of Pineapple Express and 127 Hours toplines this tense, visceral crime thriller. He stars as William Vincent, a laconic criminal with an enigmatic past, who falls hard for a New York gangster's prostitute lover (Julianne Nicholson). When the thug finds out, he forces William to leave the city and threatens him with death should he ever dare to return. Initially, William agrees, but after four years in exile spent pining for the young woman, he secretly returns to Manhattan, planning to rescue her from the ugly life that ensconces her. ~ Nathan Southern, Rovi
==================================================
Code:
<a href="http://www.listal.com/video/10476963">[img id=3073705 width=250 align=right link=false]</a>

This is just the same as linking to anything else. This time you are just directing your link to the video trailer.


People who added this item 3008  Average listal rating (1886 ratings) 6.5  IMDB Rating 6.6 
10. Secret Window (2004)

Link Opens New Tab/Window



Example:
====================================================

Click here to see the Listal's Hall of Fame

====================================================
Code:
<a href="http://www.listal.com/list/top-113-most-influential-listal" target="_blank">Listal's Hall of Fame</a>


The only thing that changes is that in the href tag you are placing "target="_blank"

Chose how you use this tag wisely. Not everyone likes having a new window opened for them when it is a simple enough task to do it yourself. Still, I like to use it for links to videos or any page you don't expect the person to hangout for very long.
jaytoast's rating:

People who added this item 672  Average listal rating (333 ratings) 7.2  IMDB Rating 7.2 
11. Thirst (2009)

How did Jaytoast do it?



Most of the time the "super fancy" formatting is just mixing various types of code together. This is from one of my better lists.

Example:
====================================================

Review by AgentLexi

Theatrical Trailer

====================================================
Code:
<[img id=1159854 width=250full align=right]
<blockquote><center>Review by <b> <a href="http://www.listal.com/viewentry/424068">AgentLexi </a></b></center></blockquote>
<blockquote><center><b><a href="http://www.listal.com/movie/thirst-2009/trailer">Theatrical Trailer</a></b></center></blockquote>


Here I just use the code for blockquotes to give the impression that the links are part of the image.
jaytoast's rating:

People who added this item 307  Average listal rating (169 ratings) 6.8  IMDB Rating 7.1 
12. Heartbeats (2010)

This spot reserved


Currently having issues with Listal and embedded videos. Hopefully this will be fixed shortly.

jaytoast's rating:

People who added this item 241  Average listal rating (153 ratings) 7.1  IMDB Rating 7.5 
13. My Name Is Nobody (1973)

Bonus Tip on List Names



Have way too many list and can't find the *one* list your working on? Yes, it gets to be a pain to scroll down and find the correct list.

Well... make life easy.

1. Create your list and give it the name you want.
Example: "Advanced Editing"

This will give you the cleanest nicest possible URL for your list.

2. Save the list.

3. Go back to edit the name and change the name to
". 1 - Advanced Editing"

Now this list will ALWAYS be at the top of my movie lists when displayed alphabetically.

The dot and space character are important and as they carry an alphabetical attribute higher then just the letter "a".

4. When you are ready to publish your list... change the name and remove the ". 1" and now your list will appear it it's regular alphabetical spot in your list collection.

Example:
====================================================

In this example I'm adding "The Pianist" to a list I'm working on with all the films distributed by "Focus Features". As you can see I like to keep all my "Works In Progress" at the top and ready to edit.



 


Also see:
Listal's Html/tag help

This list was created to try to cover some information for members wanting to go beyond some of the basics.

Added to

9 votes
Favorite Lists (35 lists)
list by Lydia
Published 2 years, 5 months ago 2 comments
24 votes
Listal Community (great lists) (36 lists)
list by The O.P.
Published 1 year, 9 months ago 1 comment
24 votes
Favorite Lists (95 lists)
list by MariaJJ
Published 2 years ago 4 comments
12 votes
WendyLorene's Favorite Lists (48 lists)
list by WendyLorene
Published 4 months, 3 weeks ago 2 comments
21 votes
Favorite Lists (55 lists)
list by Maary
Published 2 years, 7 months ago 2 comments
22 votes
My favorite Lists (319 lists)
list by IsabellaSilentRose
Published 4 months, 3 weeks ago 5 comments
28 votes
Favorite Lists #1 (30 lists)
list by kathy
Published 4 months, 3 weeks ago 11 comments
20 votes
Roman's Exceptional Listal (81 lists)
list by PulpRoman
Published 1 year ago 6 comments
10 votes
Favourite Lists - FG (34 lists)
list by FG93
Published 1 year, 9 months ago
31 votes
A List Of My Favorite Lists On Listal (49 lists)
list by portlander
Published 2 years, 7 months ago 6 comments
6 votes
Helpful Tools List From Jaytoast (2 lists)
list by Dark Warrior
Published 8 months ago 1 comment
19 votes
My Assorted Lists (57 lists)
list by jaytoast
Published 2 years, 5 months ago 1 comment
3 votes
Favorite Lists Ran8's (13 lists)
list by ran88dom99
Published 2 years, 7 months ago
3 votes
Best Lists (23 lists)
list by Juli
Published 2 years, 3 months ago
29 votes
the giraffe's favorite lists (65 lists)
list by the giraffe
Published 2 years, 6 months ago 8 comments
31 votes
Kami-chan's Favourite Lists (60 lists)
list by Kamichan
Published 2 years, 6 months ago 8 comments



Related lists

Framing - A Listal Guide
15 item list by Onion Jack
27 votes 6 comments
30 Songs, 30 Days
30 item list by GreenTissueBox
15 votes 2 comments
2014 Must See List (Editing)
120 item list by BAMF
3 votes
Cherokee's Ultimate Donkey Kong game list
55 item list by Cherokee
5 votes
Academy Award For Best Sound Editing
116 item list by AFIoscar
8 votes
Academy Award For Best Film Editing
76 item list by AFIoscar
14 votes
Super Saiyan Sonic Collection
98 item list by Cherokee
19 votes 5 comments
Rewatchables & Guilty Pleasures (Editing)
381 item list by BAMF
4 votes
Top 20 Films: Editing
20 item list by Rossjm
Whoops - Mistakes in Movies
11 item list by Nonfictionguy
4 votes

View more top voted lists

People who voted for this also voted for

Films Condemned by the Legion of Decency
Lists I'm following
My Favorite Images from Listal's Members
A movie for each year of my life
30 Reasons Not To Vote For Mitt "The Shit" Romney
What's the film that changed your life?
What Earth Can Become.
A few things I love about cinema
When I was 29... movie diary (Finished)
Listal's Favorite Books (The Results)
My favorite memories at the movies
The Cinephile's Film Journal: 2013

More lists from jaytoast

One Film - One Flag
World Cinema - Vol 2 - Listed by Country
Image Rules - More Detailed Information
Listal - The Worst Song Stuck In My Head
Thank You Images
2013 - Foreign Language Oscar Submissions


Comments

Posted: 2 years, 8 months ago at Dec 29 21:30
'tis the season of giving and jaytoast just dropped some wealth on our asses! Yay!
Posted: 2 years, 8 months ago at Jan 9 15:21
Thanks a lot!
very helpful for my future lists!!!
Avatar
Posted: 2 years, 8 months ago at Jan 11 8:12
thanks!
Posted: 2 years, 8 months ago at Jan 11 13:27
I knew the basic HTML stuff, so this was pretty helpful,...
Posted: 2 years, 8 months ago at Jan 11 14:45
thank you very much! :D
Posted: 2 years, 4 months ago at May 16 14:48
*Raises hand with a question*

How do you center an image in the center of a list and make it stay there? I am still working on the basics, don't know if I will ever get to the advanced Listal course :)
Posted: 2 years, 4 months ago at May 16 15:12
Thanks, I thought centering was covered by the Listal information but it looks like it isn't so... ta'da "To Center an Image or Text" has been added.
Posted: 2 years, 4 months ago at May 16 20:50
Wow! I loved this list, thanks a lot for your help :)
There is actually another size of text ..
Code:
<h2>Your Text Here</h2>
This gives an even bigger text :D
Edit: 2 years, 4 months ago
Posted: 2 years, 4 months ago at May 17 0:52
This is all good stuff. I'll try and use some of these techniques in my lists.
Posted: 2 years, 4 months ago at May 21 8:29
This is a great list :) Do you know if there is a way to change the size of an embedded YouTube video?

Edit: 2 years, 4 months ago
Posted: 2 years, 4 months ago at May 21 20:27
@GreenTissueBox It was easier to create a blog post about changing the size of a video then post the information in this list. Here is the 'how to'

Custom Video Size Options

It is one of those things that sounds more confusing then it actually is to do. So, I hope that helps.
Posted: 2 years, 3 months ago at May 25 0:39
Did you know you can embed youtube videos with time stamps?
You'd need to use the old embed code and add the seconds value twice like this Code:
http://www.youtube.com/v/wjseJAM6GqU?version=3&hl=en_US&start=92
.
Posted: 1 year, 12 months ago at Sep 25 9:05
Its a very helpful list !!! Is it possible to change the color of the font using in Lists ??
Posted: 1 year, 12 months ago at Sep 25 19:01
@ultimateone Nope, it is not possible to change the color of the text that appears in the notes area on Listal.
Posted: 1 year, 11 months ago at Oct 6 22:16
Can not thank you enough for these tips. Hail!
Posted: 1 year, 7 months ago at Feb 18 6:38
Some more helpful things I did not know yet! Appreciate it, Jay. :)
Posted: 1 year, 4 months ago at Apr 26 10:42
Taking the full out of the code, if only I guessed it was that easy, thank you for making this list and saving a lot of ball ache!
Posted: 8 months, 1 week ago at Jan 12 2:24
Very helpful list Jay.... it should be always on the front page. : )
Posted: 8 months, 1 week ago at Jan 13 0:25
Thanks, the pixel size for the notes area has changed since I made this list but unless your making a very specific list 500pix wide is still a good number to work with.
New Sizes
Notes area is 538 pixels wide
Description area is 642 pixels wide

A hundred thanks to Onion Jack for figuring that out and sharing his wisdom.
Posted: 8 months, 1 week ago at Jan 13 0:44
You're welcome. If anybody needs help with anything, feel free to drop me a message, if I don't know how to do something then I'll try and figure it out, if I can't figure it out then it's Jaytoast's fault. Everything around here is, it's because of cake.
Posted: 8 months, 1 week ago at Jan 13 0:58
thanx Jay ! i tried some of your editing tips and it worked perfectly.i'm still wondering where Onion Jack finds is original design pics to create is great list because i really want to upgrade the design of my best old list and my new list. thanx again Jay : )
Posted: 8 months, 1 week ago at Jan 13 1:02
I find a few elements through Google, but a lot of it is knocked up on an old version of paintshop that I have, it's all rushed and botched together though, I'm not very artistic, I just make the best I can with limited tools.

I then chop up the frames, and piece them back together like a jigsaw so that I can incorporate gallery pictures and information into each entry.
Posted: 8 months, 1 week ago at Jan 13 5:03
@Dark Warrior I stick with pretty basic stuff but like Onion Jack I alter stuff I find to make fancy headers or get things the size I need. I'm a photoshop junkie but here are some of the sites I use to find images:
http://www.clker.com/
http://commons.wikimedia.org/wiki/Main_Page
http://resurgere.deviantart.com/

I do try to be careful about where I'm taking images from. Resurgere is great for when I need textures or basic images.

@Onion Jack LOL, every time you mention cake I want pie. Oh, why didn't I buy a pie for the weekend!
Posted: 8 months, 1 week ago at Jan 13 6:26
thanx Jay & Onion Jack ! i'm only starting to upgrade the way i'm creating and designing my new list and i didn't know where to go to find some designing frame but now with those valuable info it will be easier for me to found some great stuffs. thanx again : )
Posted: 2 months, 2 weeks ago at Jul 7 18:31
Thank you for this; a handy guide!

Login or Signup to post a comment