Monday, August 22, 2011

Custom "vanity" Facebook URL

Here is another nice Facebook tip for creating nicer URL for your Facebook profile.

Simply go to
http://facebook.com/username
and set a new name for yourself.  This will give you a shorter url so in my case http://www.facebook.com/mmohler3 rather than something with loads of random letters and numbers.


This is even more relevant when you have a Facebook page for a business or something you want to advertise.  In this case the process is the same.  Follow the same link and give your page a more relevant name making it much easier to advertise and link people to your page. 
* It is important to note that at this time you need at least 25 people to like your page before you can give it a custom URL. 

Adding Blog to Facebook page

I wanted to create a Facebook page for my wife's business that would automatically import and update from an existing Blogger account she uses.

It took a little while to get it straight, but it turns out to be very easy.  Of course Facebook changes things so frequently that this method may not work an a years time, but it should get you on the right track.

First of all you need to create or have an existing Facebook page and Blogger Blog.
Click edit page from the page's profile
On the left side, choose apps and then under notes click "Go to App"
then on the left side of the screen you should see "edit import settings"
Then all you have to do is enter in the following URL, substituting 'blogname' with your blogs name.

http://blogname.blogspot.com/feeds/posts/default?alt=rss


for more info, and a video I found this link to be the most helpful
http://davesaunders.net/2009/01/how-to-find-the-rss-feed-for-your-blogger-blog/

Monday, August 15, 2011

Flash animation hints

It has been a while since I tried doing some animation in Flash.  I had forgotten the technique I had used in the past.  As a result I spent two and half hours fumbling around with movie clip symbols and layers and classic tweens.  The problem with intermediate to advanced Flash animation is that there are so many ways you can do things, it is hard to figure out the best.

When you search online you mostly get tutorials that teach you how to move something across the stage or spin around, change color, and silly stuff like that.  But what do you do when you want to make a character or something more complex?

I finally found this link
http://www.adobe.com/devnet/flash/articles/design_character_pt1.html
Which, is pretty long, but has some great and simple information in it that will get your off to the right start.


Important tips include:
-add you individual pieces as graphic symbols into your library .
-use motion tweens (CS4 and above) to move things around.
-name all of your symbols and layers descriptively.
-don't be afraid to use lots of layers and it is ok to group symbols within symbols.

You will have to figure out the rest yourself, but the link is very helpful and those tips will get you on the right path.

Sunday, August 14, 2011

Webcomic Plug

I have been working on rebooting my webcomic the last few weeks.

It is about robots and space and stuff.

www.bigfoldy.com

Friday, August 5, 2011

Flash: Cleaning Garbage + Debugger

I found a good Actionscript / Flash Blog that has a good collection of handy tips and info.

Here is a link to a post that might be handy in the future about garbage collecting to free up memory and improve performance in flash.
This might have been helpful for my major project last school year which suffered a bit from slowing down.  At the time I used .unloadAndStop() to shut down my loaders, which helped a bit but not as much as I would have like.

It also mentions a debugger that I had a quick play with:  MonsterDebugger 

Tuesday, August 2, 2011

Decompile .SWF

I have not done it yet, but for handy reference here is a video and link.
.SWF decompilers are handy for actionscript learners to see how things work or, ya know, whatever.

video from gotoandlearn.com
http://www.gotoandlearn.com/play.php?id=70

suggested decompiler (30 day free trial) This link is for the Mac version, but of course other versions are available.
http://www.sothink.com/product/flash-decompiler-for-mac/

PHP contact form

I finally got around to adding a php contact form to my portfolio.
I got the code from safari.com  and it looks like they got it from the PHP cookbook.

It is a nice secure bit of code that should be able to tell if anyone is messes with it.
The link has instructions, but it takes very little knowledge of PHP to get it working.
Pretty much plug it in and mess with some CSS if you need to.

Friday, July 29, 2011

Using Firefox web developer add-on to style Joomla

Here is a very handy tool for the Joomla designer.

First you will need to download and install the Firefox Web Developer add-on
of course you will need to already have the Firefox browser installed on your computer.

Once you have downloaded and installed the add-on, take some time to see its various features.  In our case most helpful will be the edit CSS tool.  This tool allows you to view and make changes to the CSS of most web pages.  Of course these changes only effect what you see on your browser at the moment, but it is great way to play around with the look of your site without actually changing anything permanently.
*Note that you do not have to use this method for editing your Joomla CSS, but it just makes things a bit easier.

The next step involves changing the CSS of your chosen template.
Go into your template manager and locate the template you are using for your Joomla page.  Click in there and choose edit CSS.  There may be several CSS files to chose from depending on your template.  This is where the Firefox add-on comes in handy.  It may take some time for you to identify which CSS page you need to edit.  Many joomla templates out there include very busy CSS and it takes some searching to find all of the right pieces.

Once you work out how to manipulate your template though, it is just like styling any other web page.


In my example I have added a Menu to my article.  I am happy with it, but I want it to look a bit nicer.



















There are ways to make this easier on yourself.
If you are editing a module, locate it in the module manager and under advanced parameters give your module a unique module class suffix.  This way you can directly refer to it in your CSS.
Open your page in firefox and use the web developer add-on to open Edit CSS and enter in your new custom CSS.  Here is mine in which i gave the module class suffix the name of "gallery" so now i refer to it as .moduletablegallery in the CSS.


.moduletablegallery{
margin-bottom:50px;

}

.moduletablegallery ul li{
float:left;
margin-right:50px;
height:30px;
font-size:1.1em;
list-style-type:bullet;
list-style-image:url('http://www.snoweventdesign.com/images/bullet.gif');
}

.moduletablegallery ul li a{
color:#40474C;
}


Copy the entire page of CSS code from the window and go to your Joomla backend.  Once again locate your template, find the correct CSS page, and paste your new code to replace the old code, then save.
*** very important.  Be sure you paste the complete and correct code into the correct CSS page.  If you make a mistake it can mean completely losing a page of CSS.  I have done it before and it is not fun.

Now that you have saved, your webpage should be updated with the new styling.  Mine now looks like this:



















So in review
Firefox Web Developer add-on:  helps you see changes you can make to your CSS
Go to your joomla template and edit CSS to make changes to the style of your page.

Joomla 1.5 - including menus and modules in articles

In this blog I am going to review the process I took while updating a joomla site recently, detailing:
-adding modules within your articles
-adding menus within your articles

Modules in Article!
This is a very handy and very easy thing to do, so I will make it quick.
All you need is your module installed and ready on your joomla backend.  Within your module be sure to take note of its 'position.'  In this case it should be unique like "user1."  Also be sure to select under menu assignment what pages this module will be appearing in.

Now go to your plugin manager and locate Content - load module which should be preloaded in there.  Here you only have to make sure that the plugin is enabled.

Now all you have to do is go to your article and paste in the following code
{loadposition user1} right into the text editor.
in this case user1 is the module position we specified earlier, but it can be whatever position you have assigned to that module.  (user2, left, moo).

Menus in an article!
This works almost exactly the same as adding a module to your article.  This is because when you make a menu joomla actually turns it into a module for you.
So all you have to do is make a new menu or find one that you already have.  Go to Module Manager and locate your module menu.
Just like with the previous example all you have to do is enable your module, select a unique position, select what pages it will appear on, and then use {loadposition } to place it in your article.

Pretty easy huh?

Next i'll clue you into styling your new menu

this article has two modules added with {load position} the unstyled
menu and the gallery.

Wednesday, May 25, 2011

My Portfolio (and helpful code within it)

I figure I may as well plug my online media portfolio.
http://www.mmohler.com
It is fairly graphic heavy which some may like and others may not.  It is important to note that there is some good and helpful code I have tucked in there.  No, I did not write any of the javascript/jquery.  But good news for you, I can share where I got it from.

Lightbox:
I used a very nice and flexible lightbox from No-margin-for-errors.com
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
This lightbox can do just about anything you want.  images, flash, iframes, youtube.  As far as lighboxes go it is actually quite easy to plug it into your website and there is a good amount of nice clear documentation on the website to help you out.  It also comes with 6ish different styles!  I highly recommend this lighbox.

Scroll down:
Here I found a very sweet and simple bit of code.  Click a link and it will give you a nice smooth scroll down to the content on your page.
http://djpate.com/2009/10/07/animated-scroll-to-anchorid-function-with-jquery/

Image Preview:
This one is slightly imperfect, but I suppose I was pushing my luck getting it to work.  You will notice on my portfolio that when you hover over some items a preview image pops up.  It is a really nice feature.  Sadly, it wont work on all my items.  A few of my portfolio links open up an iFrame or Flash movie.  Image preview cannot give a preview of these items.  I could work around this by rearranging my lightbox items, but I chose not to bother.  I think I had a little more trouble getting this one working.  Unlike the other scripts which are located in within the <head> this script only worked for me if i put it just above my </body> tag.  Probably has something to do with it just being javascript and not jquery.  I am not good at that stuff, so I just have to guess.
Anywho, great little feature.  Here is the link
http://james.padolsey.com/javascript/new-jquery-plugin-imgpreview/

image hover "swap" without javascript

I was working on a splash page for Fiona's site and she wanted an image to change when you hovered over it.

This is easy enough to do with normal links using css.  You just change the background color or image using
a:link, a:hover, or a:visited {}
so the background behind the link changes.

But if you want one image to switch to another it is not quite as easy.  Eventually, I found the best technique is to put an image into your HTML with a link around it.  And then in CSS put in a background image directly behind your html image.  You can then use the following CSS code to hide your HTML image thus reviling your background image.
Here is a link which explains it in better detail
http://brassblogs.com/blog/css-image-swap

and here is where I used it myself
 http://www.snoweventdesign.com

Monday, May 23, 2011

moving Joomla webpage to new Directory

So you make a test Joomla webpage and want to move it to a new location on your server?

Sounds like it should be easy, but it can be a pain in the butt what with the databases and config.php and all that stuff.

Here is how to make it easier.
You should have Akeeba backup installed on your Joomla website already.  This will allow you to make backup copies of your website in case something bad happens or, like in our case, you want to move your site.
Next go to the Akeeba website and download Kickstart.  Kickstart pretty much does weird stuff for you.  I will not go into too much detail because you should just consult the documentation that comes with it.  In short, locate the directory you want your page to appear on and first throw the Kickstart files in there followed by your akeeba backup file (.jpa) and then visit your site and go through the process.

There is a little more to it, but it works quite well.  You still have to have some idea of what you are doing though.

Good luck.

here are the links
https://www.akeebabackup.com/
https://www.akeebabackup.com/software/akeeba-kickstart.html

My wife's blog

I am stealing her idea, so I may as well give her some credit.

It is more about making real stuff in the not computer world.
PaperMakin'

Hello

Hi, this is a blog I may or may not keep up with where I can post what I am working on.
It will work as a method to share what I am doing with people and also to keep a record for myself of methods and resources as I go.

Maybe you will stumble upon something here and find it helpful.

So hi.  My name is Mike and this is a blog I am calling Media Makin'
Here is a link to my existing portfolio if you want to check it out.  www.mmohler.com