Τετάρτη 28 Δεκεμβρίου 2011

Transparent PNG in Fireworks

Having problem with png transparency in Fireworks? Solution is to save it in 32 Bit mode and not in 24 Bit mode!


In more detail
  1. Choose Window -> Optimize
  2. Select PNG32 and Matte->Transparent button
  3. File -> Export

Πέμπτη 10 Νοεμβρίου 2011

How to backup your information from Facebook

Are you afraid of loosing your photos, videos and posts you share on Facebook? You can simply backup all this information by following the steps below:

  1. Click the account menu at the top right of any Facebook page
  2. Choose Account Settings
  3. Click on "Download a copy" of your Facebook data
  4. Click the Download button on the following page


Δευτέρα 31 Οκτωβρίου 2011

How to code single column html newsletter

Here I will show you how to code your first html newsletter using rules explained in a previous post.

I will create a single column newsletter, which consists of the header, the main body and the footer, and which is used very often by most clients as an easy and effective way of sending professional newsletters.

You can see the final result below.




First of all, I use tables instead of divs for the layout of the newsletter.

I use an external table aligned at the center like this:


As you can see above, I use fixed width for the template 600px, by declaring width, cellpadding, and cellspacing for the table.

Now, I will include the whole code between


I start with the header, which I put in a seperate table like this


Til now, code looks like this:



To continue, I add another row to my external table, in which I put an internal table for the main body like this.



As you can see I have a nested table with cellpadding=20. Of course you can play with this number according to your needs.

Inside the cell of the nested table I have all the content of my newsletter. I use inline css styles to have control of the color, font and margins of the heading tags. I should do the same for the p tags, now they will take the default values of my email program. So, it is recommended to use inline styles for all the text and links in every table cell.

Til now code looks like this:


In the last step I add one more row to my table for the footer:


And here is the whole code of the newsletter. Of course, for header and footer you place your own images.





Ready to send
And now it's time to send the html newsletter! How to do this? It depends on the email program you use.


Outlook Express
  • File -> New -> Mail Message
  • Click on the body of the mail and click Insert -> Text from file,  choose files of type html and find your file on your computer

Microsoft Office Outlook 2007
  • File -> New -> Mail Message
  • Click on the body of the mail and click Insert -> Attach file,  find the html file on your computer and choose "Insert as text"

    Mozilla Thunderbird
    • File -> New -> Message
    • Click on the body of the mail and click Insert -> HTML and paste your html code into the textarea. *** In order to copy the html code, right click on your file and open it with notepad.



    Τρίτη 18 Οκτωβρίου 2011

    Syntaxhighlighter script method

    Today I wanted to include some code in my post and I couldn't do this by writing:

    PUT YOUR CODE HERE

    So I used Syntaxhighlighter script method and I wrote:


    without having any problem.


    For more details about the pre method and the script method, you can click here.

    How to insert 'new product' icon in Virtuemart

    Do you want to put a "new product" icon in your product's browse page of Virtuemart, that disappears after a predefined period?

    Find your browse page, which is into this folder components\com_virtuemart\themes\your_theme\templates\browse and make the following changes.

    Before


    add this


    And right after


    put the following code




    As you can see above, I put 10*86400, which means 10 days. Of course you can change this number.

    Img has an "icon" class, so what you have to do last, is put the following css code at the top of the page, or at your stylesheet page.



    Δευτέρα 17 Οκτωβρίου 2011

    phplist greek encoding problem version 2.10.13

    In another post, I explained what I did to solve the problem with the greek characters on phplist version 2.10.12.

    Recently, somebody using phplist version 2.10.13 had the same problem with the greek encoding on the subject.

    I made 2 more actions to solve it.

    • I changed admin/languages.php line 13 and replaced it with this

      "en" => array("English ","UTF-8","UTF-8, UTF-8 ")

    To this point, the problem had disappeared and everything worked great for me , but not for the person who mentioned the problem.

    He had a problem with the collation of the database, so here is what you have to do.

    • Go to PHPMyadmin, find table phplist_message, and change the collation of subject and message field to utf8_general_ci.

    Ways to create your email list


    Creating a list of your potential clients and keep expanding it, is the most important email marketing strategy you can use, to bring in more visitors to your site and increase your sales.

    It's simple! If you don't have many addresses to send your mails to, then your online business won't be successful.

    So, what can email marketers do to expand their mailing list?


    According to my research, email marketers have 3 options:

    1. buy email lists
    2. rent email lists
    3. create opt-in email lists or house lists


    1. Buy email lists

    There are many companies out there that make money by offering email marketers, and especially new marketers, a “shortcut” to build their own mailing lists.

    Buying email lists is not a good idea, as there’s no guarantee that the company you choose got their addresses legitimately. There are plenty of unethical companies that look at the cookies on web sites or buy lists from people who obtain email addresses, and chances are that your ISP could ban you from their service.

    A real world example is Javelin, a marketing/consultancy firm in the financial advising sector, that bought such an email list of supposed financial advisors and didn't have the desired results.

    Upon emailing to 100,000 of the records, 85,000+ bounced, clogged up the mail server and also got them fired by our web-based email provider.
     
    But, even if the company you choose has true opt-in lists, they have probably sold these same email addresses out over and over again.



    2. Rent email lists

    A different practise of building your mailing list, is called list rental. With list rental, you hand over your content to another person, that emails it to his/her list on your behalf. That's a little bit confusing, because subscribers receive emails with subjects they wouldn't expect, and many times they don't even open them.

    In the following graph, as you can see only 12% of marketers voted for"rent lists" as a marketing tactic that has a great return, compared to 45% for house lists.

                                  Presented here



    3. Opt-in email lists

    As shown in the graph above, there is a much better way to grow your list and market your business than list rental. I am talking about opt-in email lists or so called house lists, which are made up of people who ask you to send them information, having this way a guaranteed target audience and more possibilities to increase your sales.

    For better results you can use confirmed opt-in to weed out those who signed up just for the incentive.



    What do you think

    So, what do you think? Would you buy a list with no guaranteed target audience or pay to  have a sponsored message sent on your behalf to another brand’s subscribers? Have you ever done so? What was your experience?

    I am glad to hear your opinion!


      Πέμπτη 13 Οκτωβρίου 2011

      How to code HTML email newsletters


      Email marketing is a highly effective tool that helps you build strong customer relationships, using attractive and professionally designed newsletters.

      Html newsletters are visually much more appealing, can track users' email opens, clicks and forwards and remind more of a website.

      Despite these advantages, coding a newsletter in html can be a pain for a programmer. And that's because there are so many different email tools, from desktop softaware such as Outlook, Mozilla Thunderbird, Lotus, AOL, to webmail clients such as Gmail, Hotmail, Yahoo. Gmail is the most restrictive one, so if your newsletter looks good in Gmail, it will probably look good to the other programs (most of them).

      All these software tools can display the same email in a different way, because every email client has a different way of rendering the code, each with its own unique bugs, quirks, and methods for handling CSS.

      Here I will present you some useful tips you have to take into account, when you start coding your html newsletter. These tips are from my own experience and my research on the Internet about this subject.


      Dos and Don'ts

      • First of all, your html has to be simple with limited use of css, beacause as mentioned above email programs use different HTML rendering engines  

      • Use tables instead of divs for the layout of your html newsletter

      • Use inline css styles to have control of colors, fonts, margins. Linked and Imported style sheets are not supported in the large majority of mailreaders. Most webmail browsers truncate/chop off the header.

      • You have to specify the font, font color and the font size for all the text and links in every table cell. If you don’t specify a style, then most webmail clients will use their own style sheets.

      • Don't use tag attributes on the body tag. Try using a div and apply inline styles to it.

        • Don't use javascript, because your newsletter may be marked as spam.

        • Upload your images to a web server and use absolute positions 

        • Use width and height parameters for your images

        • Avoid using background images, because it is not supported in most programs 

        • The width of your html newsletter should be between 600px - 700px. Use fixed width for the template, by declaring width, cellpadding, and cellspacing for all tables and table cells.

        • Before sending the html template to your client, TEST it. Use many different programs to see how the newsletter displays in them.


          Useful links

          Here are some links with guides to CSS support in different email programs.

          1. http://www.email-standards.org/
          2. http://www.campaignmonitor.com/css/


          What comes next 

          Usually, I use a single-column or a two column layout for my newsletters, both of them having a header, a footer and the main body. I am planning to post soon the approach that I use to create HTML emails.


            Τρίτη 11 Οκτωβρίου 2011

            Forward Gmail to another email account

            Do you have many email accounts and are you afraid of loosing important emails?

            Things are simple. Gmail allows you to automatically forward your emails to another account.

            Here are the steps:
            • Click the gear icon
             at the top right of Gmail and choose "Mail settings".


            • Click the "Forwarding & POP/IMAP" tab
            • In the "Forwarding" section, select "Add new email address"
            • Enter the address to which you would like to forward your messages
            • A confirmation message will be sent to your forwarding email account, so click the verification link
            • Back in your gmail account select 'Forward a copy of incoming mail to...'  and select from the drop-down list your forwarding address
            • Choose to keep Gmail's copy of the message in your inbox or wherever you want
            • Save changes




            Δευτέρα 10 Οκτωβρίου 2011

            Delicious stacks!

            Delicious stacks





            Delicious is here with many new features!

            Delicious Stacks is a fusion between bookmark sharing and micro blogging. Instead of just saving bookmarks, you can share collections of links, related to a theme.


            How do Delicious Stacks work?

            As you can watch above,
            • first you save the links you find interesting,  
            • then you check them
            • and finally you click on the "Create new stack" button.

            Of course later you can customize your stack by choosing images to feature, by adding a title, description and comment for each link


            More Delicious updates 

            • Bookmarks are now called links, but of course have the same meaning
            • Profile pictures are now supported
            • Delicious APIs and Feeds are still supported
            • Multi word tagging is now possible


              Useful links for doing Business on Facebook

              For those you want to get their Business on Facebook and start using Facebook's tools to achieve their business objectives, I would recommend following links:



              If you have a look at these links, you will see that you have to follow 4 basic steps to achieve your business goals.

              • First of all you have to create a page for your business. 
              • By using Facebook Ads, you can reach exactly the people you want. 
              • To amplify word of mouth, take advantage of friends talking to their friends with sponsored stories
              • Last but not least, use plug-ins and custom apps to customize your page and attract more visitors.

              I will explain to my next post in more detail, how you can create your Facebook pages from scratch giving some useful tips for your Facebook marketing strategy.

              Then I will make a tutorial on how to customize your landing pages using html and css to create an attracting imagemap with clickable areas.



              How to permanently delete your Facebook account

              For those you want to permanently delete their Facebook account, I found this.

              You have to deactivate your Facebook account and NOT USE FACEBOOK IN ANY WAY FOR 2 WEEKS.
              If you login to your account during these 14 days, you cancel this way your deletion request. You should also not click "Like buttons" on other websites, or any other embedded Facebook features!

              I don't know it from personal experience, cause I don't tend to deactivate my Facebook account, but I found this topic here, and I wanted to post it to my blog!


              Πέμπτη 6 Οκτωβρίου 2011

              Homage to Steve Jobs By Colibri Branding & Design

              A homage to Steve Jobs by Colibri Branding & Design.

              You can see and download a great collection of wallpapers at Colibri's Facebook page.

              Just take a small taste.
















              Steve Jobs by Colibri Branding & Design

              Cufon line height problem

              I had a problem with line-height using Cufon and here is what I did to fix it:

              .myclass cufon { margin-bottom:6px; }

              As you can see above I first wrote the name of my class and then cufon, as I wanted this change to have effect only to this specific class.


              You can also change the doctype, but I wouldn't prefer this solution.





              Δευτέρα 3 Οκτωβρίου 2011

              Reset moodle admin password

              I installed moodle last week, but I forgot the admin password. Here's what you can do.

               If you can directly access your database, edit admin's entry and change the password field to 5f4dcc3b5aa765d61d8327deb882cf99. This will reset the password to "password".

              For those who are not familiar with mysql, PHPMyAdminto can give direct access to the database.

              Κυριακή 2 Οκτωβρίου 2011

              New features for Facebook

              Facebook has added many new features.


              Facebook homepage

              First of all users' Facebook homepage has changed, showing the most important and interesting news feeds to every single user. Previously, news appeared in chronological order, but now top stories will show on the top of the page. Even if someone hasn't visited facebook for a week, he will have at once a summary of all the news he is interested in! It will be like his "personal newspaper"!



              Facebook timeline

              Timeline will be a collection of all your photos, posts and applications that tell your story to your friends. In order to find and read your previous posts, you had to click "Older posts" again and again. Now with facebook timeline, all your stuff just don't vanish.





              You can read here, how to get Facebook timeline right now!


              Friend lists 

              You can easily see updates from and share with different lists of friends.




              Σάββατο 1 Οκτωβρίου 2011

              You don't have permission to access phpmyadmin on this server

              Yesterday I installed wamp 2.2a on my computer, but I had problem accessing localhost and phpmyadmin. I got an error something like this: "You don't have permission to access phpmyadmin on this server".

              All you have to do is just left click the wamp server icon and put the server online. Don't forget to restart all services! 

              Κυριακή 25 Σεπτεμβρίου 2011

              Syntaxhighlighter pre method

              This will be a quick post about syntaxhighlighter for blogger, very useful for scripting tutorials.

              First of course you have to download SyntaxHighlighter from the following address.

              Then upload all files to a web hosting, so that you will be able to include them in the html code of your blogger template.

              Then, navigate to your blogger dashboard and edit the html layout of the blogger template. Search for "head" section and paste following code

              
              
              
              
              
              
              


              Everytime you want to publish a post, which includes javascript you write following:
              YOUR CODE

              Παρασκευή 23 Σεπτεμβρίου 2011

              Show Google+ profile picture to google search results

              Do you want your Google+ profile picture to display next to the link of your blog to google search results?







              It's simple! Just follow these steps:
              • Add 2 links of your Google+ account to your blog. You can place one at the footer (or header) and one at the "About me" page. In order to do this, add
               My account on Google+

              You have to replace GOOGLE+ID with your Google profile link id, which appears at the address bar of your Google+ profile page. Of course you can change text "My account on Google+", if you want. But be careful! Your anchor text must start or end with a + character. Otherwise, Google won’t be able to associate your content with your Google Profile

              • Now, go to your Google+ profile page and click the "Edit Profile" button. On the links area, add both your blog's  "homepage" and "about" page and then save changes.



                  This way you will attract many more visitors to your website!

                  Facebook Timeline

                  Facebook Timeline will be available very soon. Many new features will be added.

                  First of all facebook timeline is wider than the old profile and reminds more of a personal website with slideshows, collection of videos, personal information, posts and applications.

                  At the top everyone will have the opportunity to place a big picture as a cover, and of course remove it or update it. As you scroll down, you see posts, photos, videos as they happen in time. In other words, you tell your story to your friends!





















                  Do you want to get Facebook's new Timeline now?

                  If you want to get Facebook's new Timeline right now and not in a few weeks, all you need to do is just become a developer!

                  • Type 'facebook developers' in facebook's search field or click on the link https://developers.facebook.com/apps
                  • On the page that appears click on the "Create new App" button
                  • Then give an App display name, a name for the App Namespace and tick the “Agree to Privacy policy” checkbox.











                    • Security check is also required, by completing the Captcha popup
                    • On the screen that appears on the left side, click on the 'Open Graph' link 
                    • On this screen you start by defining one action and one object for your app. Just type whatever  and click on the "Get started" button.
                    • On the following screen, there are 3 tabs : "Edit your action type", "Edit your object type", "Create an aggregation". Just click 'Save changes and next' to each of them.
                    •  After that you are complete. Go to your facebook profile and on the top part of the page, you'll see a notification to enable Timeline. Enable this and start enjoying your new Facebook Profile!

                    Δευτέρα 19 Σεπτεμβρίου 2011

                    Create a custom page in Facebook with iFrame

                    In order to encourage your visitors to "like" your Facebook page, you should customize it and make it more attractive.

                    Let's suppose that you have already created a custom page and want to put it into Facebook, but you don't know how to do it. Things are easy. Follow the steps below!













                    • Security check is required












                    • Next, you complete all basic information, 'App Display Name', 'App Namespace', 'Contact Email'. 

                    The most important section is "App on Facebook", where you complete the "Canvas URL" and "Secure Canvas URL". This is the url, where you have uploaded your page. Don't forget to write symbol "/" at the end of the url, otherwise facebook will let you know about the errors.

                    In Page Tab section you give a name for your tab as well as page url.
































                        • After that you are ready to include your custom application to your Facebook page. Click "View App Profile Page" at the left part of the page and then click "Add to my page".


                        In another post I will explain, how you can create something custom from scratch and I think it is going to be an imagemap with clickable areas using html and css!

                        Πέμπτη 8 Σεπτεμβρίου 2011

                        Localhost redirects to online wordpress site and vice versa

                        After having installed a wordpress blog locally, I uploaded it online and came up with a redirection problem.

                        When accessing the wp-admin locally, the address was redirecting me to the online site, without being able to login to the administration panel. Same happened vice versa.

                        I cleared cookies, cache, everything, but the problem still remained. I searched for the "site's url" (for example mysite.com) in my website folder, but no results.

                        Solution
                        So I checked the database and found the entry 'siteurl' in the wp_options table. I changed the value and everything worked great! This change is done through Phpmyadmin directly in the database.

                        For those who have only ftp and no database access, there is another way to solve the problem. Just put this line of code define('WP_SITEURL','http://www.mysite.com/blog')  in the wp-config.php file.

                        Τρίτη 9 Αυγούστου 2011

                        SEO for beginners - Website Optimization

                        SEO Best Pracises Part I - Website Optimization!

                        Website optimization 
                         
                        • Page titles are an important aspect of search engine optimization
                          If you build a static site, every html page should have a unique page title. If you build a dynamic webpage, the CMS should give you this opportunity.  

                          • Use description meta tags to provide both search engines and users with a summary of what your page is about! 
                          Same as above, edit directly the description meta tags in your html code or do it through your CMS, if it is about a dynamic website.

                          •  Make use of friendly URLs
                          The friendly URLs are set with some rules in the code. For example the friendly URL http://www.test.gr/Services/3 is derived from the url  http://www.test.gr/index.php?page=services&category_id=3.

                          In order to convert the URL, I used a technique known as URL Rewriting (http://www.addedbytes.com/for-beginners/url-rewriting-for-beginners/) and created a Rule like this:

                          RewriteRule ^([a-zA-Z_]+)/([0-9]+)/?$ index.php?page=$1&category_id=$2 [L]  

                          The server will check the URL of every request to the site to see if the "green" pattern matches. If it does, then Apache will swap the URL of the request for the "red" section that follows.
                            
                          • Make your site easier to navigate
                          A good practice is to put an HTML site map page on your site, and use an XML Sitemap file. There are many tools for creating your xml sitemap. I use GsiteCrawler. After creating the sitemap, I submit it at webmaster tools of google, but I'll talk about it in another post.

                            
                          • Offer quality content and services
                          That's the most important factor! A great example is my blog. Type "fckeditor styles phplist" and you'll see I am in the first page of google, and the reason for this is that the main content of my blog til now is about phplist and fckeditor!


                          • Use descriptive anchor texts.

                          • Optimize the use of images by using the 'alt' attribute


                          • Use heading tags appropriately 
                          Each page should contain one H1 tag. Apart from h1, we should use and other headings (h2, h3). Another good practice is the use of bold format in the text. This way we give crawlers a better idea of the most important parts of our documents. So, it is very important to have the right content and the right words.

                           
                          These are some of the basic practises regarding the process of website optimization. After doing all these steps, I always validate my sites according to W3C standars using the following URL http://validator.w3.org/

                          Πέμπτη 10 Φεβρουαρίου 2011

                          osCommerce

                          Today I will talk about osCommerce, an Open Source E-Commerce solution.

                          First of all you have to download tha latest version of osCommerce from the official website http://www.oscommerce.com/solutions/downloads. If you are familiar with php and wamp, you will have no problem.

                          The first problem I came up to, was the default language. I installed the greek pack from the following link http://www.oscommerce.com/community/contributions,7672/category,7/search,greek and I wanted to make it the default language of my site. I followed this link http://forums.oscommerce.com/topic/241257-problems-with-default-language/ which solved my problem. Don't forget to clear cookies, in order to see the result!

                          http://www.oscommerce.com/community/contributions,4342

                          Τρίτη 8 Φεβρουαρίου 2011

                          CKEditor

                          I will explain some useful things you should know, in order to intergrate and use CKEditor in your sites.

                          Installation
                          First of all you should download the latest version of CKEditor from the official website http://ckeditor.com/download, and then extract the downloaded archive to a directory called ckeditor in the root of your website. Of course, you are free to place ckeditor directory in any place, but I usually put it in the default one.

                          Integration
                          In order to integrate CKEditor, you need to include a single file reference in your page. If you have installed CKEditor in the ckeditor directory for the root of your website, you need to insert the following code fragment into the head section of your page:




                          Then, wherever you want, you place a textarea with class="ckeditor" and that's all!