WELCOME
to the
7th district
lastest release
[PAGE #5] about page: gold
Welcome to the 7th district!
A place where you'll find tumblr themes and resources.
● Themes are optimized for Chrome
● Codes are updated often
● Screen resolution 1366 x 768
updates
AUG 13, 2014 Hiatus message**
JUL 07, 2014 Theme #12 code is updated
JUN 27, 2014 About Page #5: Gold LP
APR 25, 2014 New Resource page
APR 21, 2014 Theme #17 Say Hello LP
APR 17, 2014 Askbox reopened!!
MAR 22, 2014 FAQ Page updated

themesbyzsu:

TUTORIAL » How to move things on click with Javascript.

Examples: 

Difficulty:  ★ ★ ★  ☆
Requested By: anonymous
Notes: This isn’t for the faint-hearted because I and many others will know how tetchy coding with scripts can be so please be wary. I can only help so much if you’re not that familiar with scripts/html/css.

Feel free to request a tutorial! 

I’ve received a few messages of people asking how I did the javascript effect on my theme 12: coexist, and I use this on a lot of my themes and pages because it’s so easy and can be used for virtually anything.

I’m going to be telling you specifically how to recreate THIS PAGE.

Also if you’re a theme maker please check this out!

Read More

eggnored:

i know a lot of these background masterposts probably already exist, but i really love doing masterposts cause they’re really useful for me and hopefully other people??

**none of these pictures belong to me

backgrounds

  • pattern backgrounds { here }
  • gradient backgrounds here }
  • sky backgrounds here }
  • floral backgrounds { here }
  • nature backgrounds { here }
  • pixel backgrounds { here }
  • animated backgrounds { here }
  • eiffel tower backgrounds here }
  • balloon backgrounds here }
  • other backgrounds here }

other pictures

  • transparent stuff here }
  • banners here }
  • sidebar pictures here }
  • pixels here / here }

themes (shortened from my other masterpost)

  • blogroll themes { here } 
  • network themes here } 
  • url redirecting themes here } 
  • collection of personal themes { here }

themesbyzsu:

TUTORIAL » How to use the javascript filter

Example 1 / Example 2 (Basic)

Difficulty:  ★ ★ ☆ ☆ ☆
Requested By: 
Notes: This is used a lot in fanfics pages, tv schedules & network themes. Really simple once you get the hang of it!

Feel free to request a tutorial! 

I’m going to be telling you specifically how to make THIS PAGE.

Read More

fukuo:

Circle Hover Menu by Fukuo

In this tutorial, we’ll be making a Circle Hover Menu. I have used it on my personal blog—but, unfortunately, I closed it as I am not active on that blog lately. I’ve been spending my time to code this one, there are many various style on the code so I hope you can find what you like!

Please note that this might not be supported in all browsers, this is still experimental. No previews are provided for the code, I will try to add it later.

Read More

"Before you learn to code, think about what you want to code

Knowing how to code is mostly about building things, and the path is a lot clearer when you have a sense of the end goal. If your goal is “learn to code,” without a clear idea of the kinds of programs you will write and how they will make your life better, you will probably find it a frustrating exercise.”

For those who maybe haven’t visited the custom theme tumblr docs lately, they have a new link. Through GA Dash, they have a free tutorial series. They have it set up to help you make tumblr themes as well as websites. So now learning to make themes or coding is easier than ever. It teaches you in steps and you can “unlock skills”. The awesome part of it is it’s absolute free. Whether this is a ploy for tumblr/yahoo to get people to submit more custom made themes to theme garden or just to have more variety of user made themes, if you’ve ever wanted to make a theme but maybe long text tutorials seemed overwhelming this is another avenue to try.

grids for themes

highgayden:

I thought it would be pretty helpful if I put together some theme resources for my followers who are interested in starting to code. It’s a hard process to learn so its good to have a toolbox!

  • CodePenthe main site is full of lovely inspiration for web design, but the pen is a very helpful place to test out and build different elements of your code that you can insert into your theme without downloading a program like dreamweaver. Its separates the different codes into HTML, CSS, and Javascript so it doesn’t take much thought.
  • ColourLoversThis website is full of different color pallets that you can use on your theme, you can look them up by the color, or just the general theme you are looking for.
  • CodropsThis is a great place for inspiration and code help. It has a wide variety of tutorials to help you make your theme as unique as possible.
  • Base Code: This is the base code by theme maker farahmir that I usually use. Its hard to start from scratch when you’re just beginning so its very generous of talented theme makers to release codes to help people get a start. 
  • Codecademy: I’ve only just started to explore this website but it seems to be a good place to start when it comes to gaining your footing as a web designer. 
  • W3schoolsIf I have really basic curiosities about a bit of coding I usually end up over here. It isn’t overly complicated. Like I said, just for the basics. 

Happy coding!

Anonymous said:

is there a specific size the icon image has to be for your most recent theme?

Nope, it’ll rejust itself to 100x100, but I recommend that you use an image that has a same width and height length.

vitanica:

patterns | backgrounds #3

Para descargar: Da click derecho en la imagen que quieras usar, luego Guardar Como.

Anonymous said:

[Theme #6] How to put border post?

There’s the screen border option in the theme.

lar-ni submitted:

Help please with network badge

hi i’ve installed your theme 6 and i’m trying to put a network badge on my page but it’s not showing up. could you try putting the badge in my update tab? heres the link of blog:

Oh snap you gave me the whole theme code. o.o I think it’s best if you ask the person who made the updates tab for help.
Anonymous said:

i know some themes give you the faded picture option, but my theme doesnt give that option, so is there anything i could add to my html to get faded pictures?

I don’t know which theme you’re talking about. Usually I name the posts as .posts { so search for that and add this under it

.posts {

opacity:.8;

after that search for .posts:hover{ and add this

.posts:hover {

opacity:1;

Anonymous said:

I really like ALL of your themes, but they all seem so dark. Will you ever make one that's simple, light, airy, and I don't know, bright?

My latest theme Say Hello #17 is similar to your description. You know it’s just the live preview that shows a dark theme right? There’s color options to change to your ”simple, light, airy, and bright” description.

Changing a one columned theme into a grid theme (WITH MASONRY)

themesbyzsu:

I’ve seen tutorials on how to make a multi-columed theme, but it never really includes masonry or infinite scroll so I’m going to try fill that void!

Making a two-columned theme is really basic, it’s just when you edit other people’s themes where it becomes a little bit more complicated, because you have to find things. I’m going to be using my base code as an example theme and editing it to make it multi-columned.

Difficulty:  ★ ★ ☆ ☆ 
Requested By: anonymous
Note: This tutorial may not work on all themes, and if it doesn’t I highly recommend either finding a theme that has multiple columns already installed!

Next Tutorial: Moving things on-click with javascript. (Example)

Feel free to request a tutorial! 

Read More