Themes by Hisabeel - CLOSED

A blog with a bit of everything.

[lmthemes]

Static Previews

It was a surprise to me how often I get questions about static previews from how to what. Hopefully this will help confused theme users and makers out there. I not only explain what they are and why theme makers need to use theme more but how to create them.

Keep reading

[hisa-themes]

Olá a todos! Depois de 3 anos eu decidi usar o site Pastebin. Por quê? Porque o Free Text Host começou a dar-me problemas. 😢 Ao longo de 4 anos eu criei aproximadamente 190 temas e em dezembro 2016, eu descobri que perdi todos os códigos por causa dos problemas com o antigo servidor de códigos.

Mas vamos esquecer os problemas ruins, que foram arrumados em 2016 e vamos começar tudo de novo. Com melhores códigos, melhores temas, melhores tutoriais, mais ajuda, mais de tudo. O melhor para mim, e acima de tudo, o melhor para todos.

Irei criar um novo blog de temas com tudo atualizado e com dois tipos de língua, em português e em inglês. Tudo o que for publicado no novo blog será em ambas as línguas, para facilitar a comunicação com todos (tal como já acontece com este post).

Obrigado a todos pela compreensão e esperem por mais notícias. Assim que houver um novo URL e um novo formato de blog, vou entrar em contacto.

Este será o meu último post em hisa-themes, por isso, até mais. 🙏

Com amor, Helena 💓

x -------------------------------------------------------------------------------------------------------------- x

Hey guys! After 3 years I decided to use Pastebin. Why? Because Free Text Host started to give me problems. 😢 Over 4 years I created about 190 themes and in December 2016, I discovered that I lost all the codes because of problems with the old code server.

But let's forget about those bad problems, which were fixed in 2016 and let's start all over again. With better codes, better themes, better tutorials, more help, more of everything. The best for me, and above all, the best for you.

I will create a new blog of themes with everything updated and with two types of language, in Portuguese and English. Everything that is published in the new blog will be in both languages, to facilitate communication with all (as already happens with this post).

Thank you all for understanding and look forward to more news. As soon as there is a new url and a new blog format, I'll get in touch.

This will be my last post in hisa-themes, so see you later. 🙏

With love, Helena 💓

[hisabeel]

FUCK THE FREETEXTHOST

MY THEMES WILL BE TEMPORARILY UNAVAILABLE BECAUSE OF THE FREETEXTHOST ERRORS, I’M SORRY TO ALL, BUT I AM TRYING TO FIX THE PROBLEM.

Hope you understand x

[aogthemes]

LINK HOVER EFFECT: BRACKETS [preview]

To install:

Go to your customise page, and click “Edit HTML”

Put this code under <style type=“text/css”>

Then, put <div class=“linkhover”>your content</div> where you want it. Make sure to retype the quotation marks!

If the place you want it already has a div id assigned, you can simply add class=“linkhover” to it (ie <div id=“blah” class=“linkhover”>) Again, make sure you retype the quotes!

And that’s really all, I hope this helps! Enjoy :)

Note: I didn’t make this; here’s the credit for the codes!

[hisa-themes]

Grateful (Double Version - Christmas) - Theme #186 This theme consists of:

six links (icons and words)

two/four graphic images

top header

two columns

permalinks by me

normal description

one picture for sidebar

snow falling by Alina

lines around blog for effect

Christmas Version (here) | Want this? Ask me (LIKE IF YOU USE)

[hisa-themes]

Hey guys! We are practically a month of Christmas! What you seem to have a exclusive Christmas theme just for you? Yes! The idea is to make this Christmas exclusive themes for my followers. To request a theme just for you, just send me a message (here) by answering certain questions (questions here) and I will respond as soon as possible. I will do the themes from December 1 and will be delivered until the day December 20. Orders are open from the 5th of November until the 1st of December. Want a theme only yours? Run!

[hisa-themes]

“Sleepy Hollow” - Theme #185 This theme consists of:

two columns

six links (lovely icons)

one picture for sidebar

permalinks by me

three graphic images

Want this? Ask me (LIKE IF YOU USE)

[hisabeel]

Thank you!

Hey guys! I want to thank all the people who helped me to recover my blog and my followers. Although I have lost almost everything, I already got, in two weeks, 500 followers thanks to the help of my friends. Thank you all. :)

Loveyou x

[felinum]

Due to popular demand, I decided to post the code for the Updates Tab from my theme “shortcake” separately. Credit isn’t mandatory, but very much appreciated. Installation tutorial under the cut.

Keep reading

[htmlqueens]

popup animations

hiiii, so i went on a massive popup animation hunt because i realized that there was no go-to-place for people to easily find popup animations. i decided to make a list of all the animations i found. some are from fyeahcodes (tweaked obviously) but most are made by me. keep in mind that these were made for Chrome but i tried by best to make them work with other browsers.

reblog/like if you found this useful. also this was very time consuming so if you could possibly link people to this tutorial, or redirect them here, that would be the bees knees. if you have any questions please feel free to contact any of us at htmlqueens :)

UPDATED 11/06; if these codes don’t work for you, check the alternative codes on this post. 

also you might need to retype the quotation marks/apostrophes.

/Claudia

Keep reading

[hisa-themes]

“Queen Street” - Theme #184 This theme consists of:

three columns

five links (font-awesome)

one picture for sidebar

permalinks by me (simple design)

bars around blog

description by click (panel navigation)

Sidebar hover (preview) | Want this? Ask me (LIKE IF YOU USE)

[htmlqueens]

Updates tab masterpost

I get a lot of questions about the hover tabs I use and where to get them, so here’s masterpost of a ton of updates tabs that I’ve used or have just found around the internet that I like :)

Keep reading

[hisa-themes]

“Instinct” - Theme #183 This theme consists of:

two columns

five links

one picture for sidebar

permalinks by me (simple design)

hover effects on posts by me

bars around blog

arrow on description

Want this? Ask me (LIKE IF YOU USE)

[hisabeel]

Were you my follower? Follow me again!

Recently I needed to delete a sideblog and it happened again, another one of tumblr errors, my main blog (hisabeel) was totally deleted. I’ve talked to the tumblr team and not getting any response, so I decided to make this post to explain to some people what happened. Unfortunately I lost all my followers and friends, posts, likes, networks, everything, and lost contact with some of them, I could only contact some of them. The only thing I can ask my old followers is to follow me again, I’ll follow back again all those who followed. Including those who I don’t follow before. Thank you all and I hope you understand. :)

[hisa-themes]

Hello everyone! I decided to make this little post explaining the basic code to make a theme. My basecode is already outdated (I'm updating) and then some code stopped working, so today, I will do my best to help you. (This tutorial is also available in portuguese here).

Let's know the main tags to build a theme:

<html> <head> <style> </style> </head> <body> </body> </html>

Now, we'll understand what each does:

<html></html>: Between these tags is the whole structure of your theme.

<head></head>: It is some scripts and fonts of words.

<style></style>: Here is all of your design theme, the whole design of it is between these tags.

<body></body>: All you created, the whole look of your theme is the style tag and it will stay in the body, as already says the same tag, the theme of the body.

Let's start making the theme? Go on customize, delete ALL the codes that are there and paste the following code:

<html> <head> <title>{Title}</title>  <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}">      <meta name="description" content="{description}" />  <style type="text/css"> </style> </head> <body> </body> </html>

Now, we'll understand each one of them:

<title>{Title}</title>: The title is the small title that appears in tab the blog in front of favicon (see this image).

{Favicon}: The favicon is the small icon that appears in tab the blog (see this image).

{description}: You can write something about you or about your blog, this description may have the size you want.

<style type=“text/css”>: As you saw I just replace the <style> by <style type=“text/css”> because it's better, but not confused with it because nothing will change.

Now let's work a little on the style of theme. Paste the following code BELOW/AFTER the <style> tag:

body{ background-color:#BACKGROUND COLOR; font-family:FONT OF WORDS; color:#TEXT COLOR; text-align:TEXT POSITION; font-size:WORD'S SIZE; background-image:url('INSTEAD A COLOR YOU CAN PUT A IMAGE'); background-attachment:fixed; }

a{ color:#LINK COLOR;   text-transform:none; }

a:hover{ color:#LINK COLOR PASSING THE MOUSE; text-decoration:none; }

Again, we'll understand each:

Background-color: is the color of your background.

Color: it's your theme color of text, here is a table of the colors you can use.

Text-align: it is the position of text. It can be: center, left, right or justify.

Font-family: it is the source that you will use, can be verdana, arial among others, can also be a source of your computer.

Font-size: is the font size of your theme, the value of it's always in px, then whenever you increase or decrease the size put a number and in the end put px, for example:10px.

Background-image: if you want your background to be with an image instead of a color, put the link of your background there, but always respect (''), put your link ever between ('') so: ('HERE lINK'). To get the link of your background check this site, host your image and place the link.

Background-attachment: if your background is fixed or not, so that it is fixed only place fixed, and for it not to be, is absolute.

Text-decoration: read this tutorial and learn what it is.

Background-repeat: for your background repeat or not. To repeat is used background-repeat:repeat, and not to repeat is used background-repeat:no-repeat.

Padding/Margin: tutorial explaining the difference.

Now we will work with the title:

h1{ text-align:center; font-size:20px; font-family:WORD FONT; color: #COLOR FONT;}

Working on scrollbar:

::-webkit-scrollbar{ width:WIDTH COLORpx; height: 2px;} ::-webkit-scrollbar-track-piece{ background-color:#BAR COLOR; repeat scroll 0 0 transparent;}   ::-webkit-scrollbar-thumb:vertical{ height:5px; background-color:#BACKGROUND COLOR VERTICAL; } ::-webkit-scrollbar-thumb:horizontal{ width:5px; background-color:#BACKGROUND COLOR HORIZONTAL;}

Explaining:

Width: is the width of something.

Height: the height of something.

Color of the scroll bar background vertically: the bar down together when we go down the page, there is the color.

Color of the scroll bar background horizontally: as it says, is the color of the bar that is "lying."

Now, the sidebar:

#sidebar{ position:fixed; width:auto; height:auto; margin-left:60px; margin-top:95px; border:3px solid #BORDER COLOR; height:285px; width: 252px;}

#sidebar img{ position:fixed; display:block; height:285px; width:252px;}

What does each code?

#sidebar: is the box for sidebar.

#sidebar img: is the image that is within your sidebar box.

postition: explained before.

margin-left: is the distance from the left side to the sidebar.

margin-right: is the distance from the right side to the sidebar.

border: is the border that is around all your box of sidebar.

display: the display property specifies the type of box used for an HTML element (learn more here). NEVER CHANGE THAT CODE

Description:

#desc{ background-color:#BACKGROUND COLOR; position:fixed; width:WIDTH OF DESCpx; height:HEIGHT OF DESCpx; font-size:SIZE OF WORDSpx; font-family:FONT WORD; text-align:center; color:#DESC COLOR; padding:5px; margin-top:450px; margin-left:100px; overflow:scroll; text-transform:none;}

Explaining:

Background-color: is the color of the box from your description, but if you want the description box has no color, only the color of the letters, just put background-color:transparent.

Overflow: scrollbar in the description, you can withdraw it putting none.

ALL THE REST ALREADY EXPLAINED PREVIOUSLY.

Let’s work on menu:

#links{ width:320px; margin-left:58px; margin-top:400px; text-align:center; position:fixed; }

#links a{ float:left; text-decoration:none; text-align:center; font-size:10px; text-transform:uppercase; font-family:verdana; background-color:#070c0b; color:#fff; height: 18px; width: 53px; margin-right:1px; line-height:15px; padding:2px; }

#links a:hover{ -webkit-transition:1.5s ease-in-out-multiply: 1.5; -webkit-transition:1.5s ease-in-out; background:#BACKGROUND COLOR PASSING MOUSE; color:#WORDS COLOR PASSING MOUSE; }

Learn more:

Float: the float property specifies whether or not an element should float.

Line-height: learn what is it here.

There are thousands of codes to explain and thousands of codes that are still lacking to compose a theme but that will be learned gradually. Hope it helps you. :D

[hisa-themes]

“Uncover” - Theme #182 This theme consists of:

four columns

seven links

one picture for sidebar

permalinks by me (simple design)

bars around blog

hover description

two types of titles

Want this? Ask me (LIKE IF YOU USE)

[hisa-themes]

Omg you have the best tutorials page I have ever seen on tumblr! I'm learning html and css to edit my themes a bit better, or make themes for myself, and this page seems to be very helpful!

Oww, really? Thank you so so so much, it means a lot <3