FRIHOST FORUMS SEARCH FAQ TOS BLOGS COMPETITIONS
You are invited to Log in or Register a free Frihost Account!


Tutorials





WickedGravity
Well, I have seen a few people posting questions about how to's and what not and I decided to make a thread and see if I could help some people out.

Now, before I go and write and write and post things no one wants, I will ask and see what the most needed tutorials out there are.

So, if you have any questions on just about anything scripting related, go ahead and post in this thread and I will see what i can do for you.
meangurl
anything? ok this is not the "most needed" tutorial but if you'll consider this then, thank you...

how about skinning wordpress 1.5 as i've been through a lot of mischief with 1.5 and never been successful. thanks Wink
Uchiha Sasuke
erm ... is a question that why it put how to but not what not cause what not mayb is what not need to be install ? or what not needed for forums or webby that's why they nv put what not but to how to
meangurl
Uchiha Sasuke wrote:
erm ... is a question that why it put how to but not what not cause what not mayb is what not need to be install ? or what not needed for forums or webby that's why they nv put what not but to how to



uhmmm... what? sorry but i really can't understand a single word. please correct your grammar to make it at least understandable for others.
n0obie4life
meangurl wrote:
Uchiha Sasuke wrote:
erm ... is a question that why it put how to but not what not cause what not mayb is what not need to be install ? or what not needed for forums or webby that's why they nv put what not but to how to



uhmmm... what? sorry but i really can't understand a single word. please correct your grammar to make it at least understandable for others.


i'll correct for him...its SINGLISH...if u ever been to singapore...Wink

[edit] i decided not to correct it, even I who is his friend, don't even understand a single word...its horrid singlish Wink
Texas Al
How about "the world's briefest tutorial on WTF is Mambo thinking?"

Let me explain what I mean by that.

Clearly Mambo has some kind of internal way of organizing stuff into menus, categories, modules, etc. Clearly people who know how to use it can make it do almost anything.

People who don't know it flounder around, deleting, unpublishing, renaming stuff trying to just make a normal block of text show up in the main content area of the screen and make all the newsflashes, default links, and the login box go away. Now I'm sure this is buried someplace in the Mambo guide and the people who know Mambo have probably read this guide start to finish. But that's not really a tutorial, is it? Tutorials are for impatient people who prefer to learn as they go instead of RTFM-ing. Anyway, most software is self documenting-- doing something usually has an obvious and understandable effect, so you don't even need a tutorial, you learn it by playing with it. Mambo is more opaque in that matter.

I think it's just a matter of saying "Hey, you dummy-- content and either be assigned to a menu or a block, and menus or blocks can be assigned to categories. Where something shows up on the screen depends entirely on... <<and this is the part I can't complete yet because I don't know Mambo yet>>".

Lest you think I'm too lazy to deserve a tutorial, I do plan to learn this myself the hard way eventually. If I get to it before anybody writes a tutorial, I'll fill in the bracketed parts above myself and whoever comes along afterward will have a nice, to-the-point tutorial for the one thing that I think pretty much anybody would want to do as soon as they install Mambo.
Texas Al
How about a more general tutorial for de-junkifying CMSs?

Here's what I mean.

There are certain things a lot of people will want to do with any CMS regardless of what kind it is. It would be nice to have like a grid or something that cross references how to do the same thing in all of them. Here are some of the things everyone will find try to do at one point or another.

1. Change the logo.
2. Tweak an existing theme.
3. Have a list of variables that can be called from a theme (or at least the essential ones).
4. Remove the "login" box so it doesn't look like a CMS anymore.
5. Remove the "forum", "news", "blog", "feeds", "ratings", and "comments" features if they're enabled by default.
6. Remove any of the boxes in either side-panel and which boxes are hard-coded in and unremovable (if any).
7. Remove the side-panels, the header, and the footer (if possible).
8. Change what shows up in the main content area in the middle by default. Have several alternate main content areas that can be accessed via links on the side panel or menu.
9. How to embed HTML, Javascript, and Java applets.

If you understand these nine things about a CMS, you basically know that CMS. And if there was a Rosetta Stone of CMSs like that, people could have a working knowledge of them all just by reading that page as needed.[/i]
WickedGravity
Alright everyone, I have read what is here thus far and will be making some tutorials tommorow w/ some pictures and walkthroughs if necessary.

I will post a new topic for each one as I make them.

Idea though, I will post this in the suggestion thread as well, break scripting and tutorials into two seperate catagories.

I can post code examples all day, I just want to make sure people know where to look.

See you in a few hours!
davmcmul
I know I'm a bit late here but it's something I'm really interested in doing but not quite sure how to do.

How can I include images with css?

I want a real image now, not just the background-image. There's lots of reasons I want to do this, I could use it together with the pseudo class :before to put a nice little pic at the start of each paragraph, or (this is the one I really want to do) I might be able to sue it to make a pic change when the cursor is hovering over it (I've been trying to do this with javascript but it never changes back).

I don't think it really needs a tutorial of its own but it could easily be added to an all round css tutorial

thanks!
Texas Al
How can I include images with css?

How about a <div> element with nothing in it, but a background image specified in the CSS along with its size. A background without a foreground is... a picture!
WickedGravity
meangurl wrote:
anything? ok this is not the "most needed" tutorial but if you'll consider this then, thank you...

how about skinning wordpress 1.5 as i've been through a lot of mischief with 1.5 and never been successful. thanks Wink


Tutorial Posted and hopefully answered for you the way you had in mind.

Any questions can be left on the thread I made in the tutorial section and I will do my best to answer them.
WickedGravity
Texas Al wrote:
How about "the world's briefest tutorial on WTF is Mambo thinking?"

Let me explain what I mean by that.

Clearly Mambo has some kind of internal way of organizing stuff into menus, categories, modules, etc. Clearly people who know how to use it can make it do almost anything.

People who don't know it flounder around, deleting, unpublishing, renaming stuff trying to just make a normal block of text show up in the main content area of the screen and make all the newsflashes, default links, and the login box go away. Now I'm sure this is buried someplace in the Mambo guide and the people who know Mambo have probably read this guide start to finish. But that's not really a tutorial, is it? Tutorials are for impatient people who prefer to learn as they go instead of RTFM-ing. Anyway, most software is self documenting-- doing something usually has an obvious and understandable effect, so you don't even need a tutorial, you learn it by playing with it. Mambo is more opaque in that matter.

I think it's just a matter of saying "Hey, you dummy-- content and either be assigned to a menu or a block, and menus or blocks can be assigned to categories. Where something shows up on the screen depends entirely on... <<and this is the part I can't complete yet because I don't know Mambo yet>>".

Lest you think I'm too lazy to deserve a tutorial, I do plan to learn this myself the hard way eventually. If I get to it before anybody writes a tutorial, I'll fill in the bracketed parts above myself and whoever comes along afterward will have a nice, to-the-point tutorial for the one thing that I think pretty much anybody would want to do as soon as they install Mambo.


Alas Texas Al, I am afraid I have actually never used Mambo. I know this makes me a horrible human being who deserves death, and, in point of fact I will make sure to start to use Mambo immediately to try and teach all the ways of it.

I am serious too.

Give me a little bit.
davmcmul
sorry texas Al but I'm just not happy to settle for having a background image that lacks in foreground, too similar to using tables for information that shouldn't be tabulated Razz .

And I'm pretty sure I would then have to go and set the border of that div element to match the image, too much hassle, if there's another way, I want to know about it!
James Bond-007
Moved to the Tutorials forum.
Texas Al
davmcmul wrote:
sorry texas Al but I'm just not happy to settle for having a background image that lacks in foreground, too similar to using tables for information that shouldn't be tabulated Razz .


How is it similar, other than both involve some sort of tag? The problem with tables is that you can't control their position precisely, and some window sizes make them look broken. A <div> can be positioned and sized anywhere on the page you want (almost), it can overlap or underlap other elements, and it can even be set to be transparent. Nothing at all like using a table.

Quote:
And I'm pretty sure I would then have to go and set the border of that div element to match the image, too much hassle, if there's another way, I want to know about it!


A <div> doesn't have a border unless you set one. Simplest thing to do is just try it. Put a <div id="picture">&nbsp;</div> at some random place in your page and look at it. Without CSS to tell it what to do, that div is completely invisible (except for the nonbreaking space you put in the middle). That's the whole reason <div> and <span> exist.

Now, put something like this in your CSS inline definition or file...

div #picture { border-style: none;
border-width: 0px;
background-image: url(file:///C:/temp/picture.gif);
background-repeat: no-repeat;
height: 157px;
min-height: 157px;
max-height: 157px;
float: left;
margin-right: 5px;
margin-left: 5px;
margin-bottom: 5px;
left: 5px;
bottom: 5px;
position: relative;
right: 10px;
padding-right: 10px;
width: 510px;
max-width: 520px;
background-position: left center;
min-width: 520px;
}

(changing the name of the picture and all the sizes as appropriate for the picture... the min width and height should be slightly larger than the picture's size in pixels so the text doesn't run right into it).

I know it's kind of clumsy, but hey, precise positioning means having to put more information in there than if you just want it to be wherever. If anybody knows a simpler way to do this, please correct me.

By the way, this is for a picture that's inline with your text and the text wraps around it. If all you want is a banner or avatar or something, that's much easier because you don't have to worry about text wrapping so you can get rid of the padding and float instructions.
davmcmul
by border I meant height+width.

It is similar to using tables for information that should not be tabulated because background-image is not supposed to be used for a foreground image...

both are using something for the wrong purpose.

+i can't use that to put an image before each paragraph using the before pseudoclass.
meangurl
hey, do you also accept graphic tutorial request?

like for vector tutorial on adobe illustrator cs? thanks
Texas Al
Quote:
both are using something for the wrong purpose.

+i can't use that to put an image before each paragraph using the before pseudoclass.


If it renders reliable in all current browsers then it's not wrong.

Anyway, do you want the paragraph to wrap around your image (like drop-caps or like one of those Slashdot topic icons) or do you just want a spacer image separating the paragrahs?

In either case, you might be able to put in an <img> tag and use position, left, top, and float to adjust where it shows up and how the text behaves near it.

Or you could have a look at how the experts do it. I bet you 5 FRI$ that they use backgrounds like I described. Wink
ariesdaniel
tutorial de after effects, "depredator" http://usuarios.lycos.es/ariesdaniel my tutorial is good, bye
davmcmul
no, i don't want to go through my code putting in extra image tags all over the place, i want to use the :before pseudoclass to stick one small image at the start of each paragraph, not dissimilar to a bullet point at the start of each list item. I'm positive that there is a way to do this with css and the aforementioned speudoclass because i've seen it done, as soon as i figure it out/find a site that has some info on it, i'll post it (the site where i saw it done is no longer there).


....

AHA!

found it!

in the before example you just do this:

p:before{
content: url("image.png");
}

voila!
Texas Al
davmcmul wrote:
p:before{
content: url("image.png");
}


Does that work both in IE and Firefox? I thought IE ignored most pseudoclasses?
davmcmul
meh, my site isn't that big so i usually ignore ie users, i will probably change if i ever put anything worht viewing on it....

however,

Quote:
Does that work both in IE and Firefox? I thought IE ignored most pseudoclasses?


So now you tell me?!

(i'm not sure)
Texas Al
You could just specify the colors in CSS pixel by pixel like this guy did.

http://www.stunicholls.myby.co.uk/menu/cssart.html

Like the CSS fanboys say, all you need is CSS (but a touch of OCD wouldn't hurt).
Related topics
photoshop tutorials gonzo likes
Free Tutorials
Some Photoshop tutorials
[PHOTOSHOP] video tutorials..
Awesome Flash Tutorials (kirupa.com)
10 photoshop effect tutorials
Flash MX 2004 Tutorials
The Design Dump - Articles and Tutorials - Forum
C# tutorials
Programming Help & Support Guidelines
Photoshop Tutorials
HTML Tutorials
Flash Tutorials
PHP Tutorials
Reply to topic    Frihost Forum Index -> Miscellaneous -> Tutorials

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2011 Frihost, forums powered by phpBB.