How to manage polls

 

In order to manage polls in your Magento store please do the following: 

1. Open the admin panel, type "admin" after your domain name in the browser address bar. 
2. Go to the "CMS" tab 
3. Click the "Poll Manager" button 
4. Here you can see the default poll, click on it for editing. You can edit the poll title and the website where the poll will be visible. 
5. Click the "Poll Answers" tab to get access to the answers page where you can edit poll answers 

To add a new poll, click the "Add New Poll" button. 

1. Type the poll title (the question). 
2. Select the website where the poll will be visible 
3. With that done, go to "Poll Answers" to add answers 
4. You also can specify the number of votes for each answer 
5. When you’re finished, click the "Save Poll" button to save your new poll.

How to manage html pages content

 

In case you want to change the page content and layout, please do the following:

1. Open the Magento admin panel.
2. Select the "CMS" tab
3. Then click "Manage Pages". You are on the "Manage Pages" screen. Here you can see a list of all the HTML pages used in the store.
4. Click on the page that you want to edit.
5. You can change:
    - the page title
    - the pages identifier (the unique page name used in links and code)
    - enable or disable it
    - the page content.

Note that you should use HTML while creating your page content.
Use the "Custom Design" tab to edit the page layout. The "Layout" drop-down menu will allow you to change the page structure itself.

How to manage currencies

 

In order to manage currencies in your Magento store please follow the next instructions: 

1. Enter the Magento admin panel. 
2. Click the "System" tab 
3. Then click "Configuration" 

First of all, we should make sure that the currency that we are going to add is installed. Scroll down the page. 

4. Select the "System" menu item in the "Advanced" section 
5. Click the "Currency" tab 

Make sure that the required currency is selected (hold down the CTRL key for multiple selection). As soon as you find the required currency in the list, head to the "Currency Setup" page. You should apply the changes to your specific store view. As you can see, the default display currency is the US dollar. You can add any other installed currency using the drop down menu. 
Please, be advised that the currency that you want to use should be selected in the "Allowed Currencies" list (hold down the CTRL key to select several currencies). 

6. Save the configuration 

For checking the currency rates go to "System -> Manage Currency Rates" menu item. Here you can see your currencies and rates. You can update the currency rates using the "Webservicex" automated services. Click the"Import" button for that. You also can set your rates manually.

How to manage admin details

 

For changing the Magento administrator details you should:

1. Log in to the Magento admin panel
2. Click the "System" tab
3. Select the "My Account" menu item. You can see the admin account page and here you can change the administrator login, first and last name. e-mail address and a password.
4. When you are done, click the "Save Account" button at the top.

How to edit the footer copyright notification

 

If you need to change the footer copyright notification use the next instruction: 

1. Open the Magento admin panel 
2. Select the "System" tab 
3. Click the "Configuration" menu item 
4. Select the "Design" menu item 
5. Click the "Footer" tab. Here you can change the copyright notification 
6. With that done, click the "Save Configure" button.

How to disable side-boxes

 

For disabling the modules in your Magento store please use the following instructions: 

1. Log in to the Magento admin panel. 
2. click the "System" tab 
3. Select the "Configuration" menu item 
4. Click the "Advanced" menu item. Here you can disable any module you want. 
5. Find the modules you want to disable in the list. 
6. Select "Disable" in the drop-down menu 
7. When you are done, click the "Save Config" button to save your modifications.

How to Customize Magento Product Page

I'm back with another tutorial about Magento. I'm not the best man you can find about Magento. But I'm trying to learn something from forums. The best you learn something is when you can explain it to someone else. So this is for that!

As I had mentioned in my previous post Magento is an open source ecommerce application made with PHP and Zend Framework. Company behind it is very dedicated to this project and works a lot about it. But the missing part is the tutorials I guess. There isn't enough entry in their wiki and if you want to learn something, you have find it out yourself. So let's begin!

This tutorial will cover basics about how you can find your way in the magento code and get to the right place and how you can change a product's page design by changing the place of the images from left to right.

I tried this on Magento version 1.1.3 and it worked. Check here for the latest version.

First of all we have to understand which part of the code does show the product's detail page. You can guess of course. But don't do it and open the Magento folder. Navigate to /app/code/core/Mage/. Then you will see.

No I mean it, really! Go and look on that folder! So your best bet will be theCatalog folder. So is mine. So I enter the folder and look for things which can suit me. Well As I'm a bit familiar with Magento and I know that they have mostly separated the logic and design. So there must be somewhere where this binding must have been done. So the people who has read the previous post and people who are familiar with Unix systems, they must have noticed theetc/. Yes this is the folder you are looking for. In it, there is the configuration file: config.xml. Not that hard to find I guess. Now the real problem is to find out, what is related with what?

config.xml is a huge file and if you don't know what you are looking for you are in a bit of troube but don't be afraid. Let's cover the details a bit and make an understanding. In my previous post I had entered some information about modules' configuration files. But it was a small file and let's say I knew what I had to write. So let's look under the hood. For people who does not want to see how the engine works, the file you are looking for is/app/design/frontend/default/default/layout/catalog.xml. (Maybe instead of looking to code I should have checked folders better :)

There is a version info, ok. There is an admin part, which does not mean a lot to you nor to me. Maybe it's something fatal but it doesn't mean a lot for us (Nothing more than a newbie I'm). So the next part I'm more comfortable, as I understand what it belongs to. Well first of all, we know that this part is global. It will be used for all the parts where this module is being used. And the next part is models. This is about database fields. You can see that, below the models, there is the definition of a resourceModel to a class. This means the class defined in this config, will use that resourceModel. But what is this model? Next part is this. You see that the name of the resourceModel (catalog_resource_eav_mysql4 for me) starts now and a lot things is defined. Classes (let's say the database's driver folder) and database tables related to this resourceModel are listed here. It basically says that, this attribute comes from this table. You can be shocked by the count but open your phpmyadminand you will see that there are 192 tables in it. Ouch! The only important part is that (if you don't want to change the core aspects of course), if you are stuck which table is what, you can always look to these configuration files and find out which table is related to which module. A bit confusing but better than nothing.

Forget about the database and let's keep going on the config file. Passing to models we come to the resources part. I guess this is about what connections will be used for querying and other things. You see that in catalog_read, there is a connection value and this is core_read. You may guess that it defines which connection this database drivers will use, comes from here. You are right, probably. But I'm not sure, and it doesn't look I need this part to change the place of the picture, so I move on.

And now comes the block part. This isn't new and I'm happy to see something that I know from my previous experience. In CMS pages, this part of the configuration had helped me to get to the layout so this might be the part where the output is given. So I get to the/app/code/core/Mage/Catalog/Block/ there are some parts about products but this is the backend part as I see. There isn't any meaningful htmls in files which are in that folder. So I had a hope that I had found it, but it seems that this is not the case yet. So I move on.

Now a part that I do not even have slightest idea comes and I pass. The next part is adminhtml. I mean HTML! This can be it! There are some definitions about some things but I do not get it. There is a folder/app/design/adminhtml/default/default/ in the file system. And these bindings refer to the template folder. I assume there are some language additions and some other tweaks about admin pages. But again, I'm not sure.

Finally I have reached the frontend part. I'm now sure that this is the part I'm looking, as there are language definitions, per_page_values and layout! There are some things which still I do not get what are they for, but I see thecatalog.xml. And this my best bet! I open the file and I see: Default layout, loads most of the pages! Yes I found it!

Below that part, there are things which are not much useful to me, things like url rewrites and some more configuration values. You can alter the general layout of Magento by changing these options by the way (As this module is about catalogs, the general view of catalogs of course, not the payment part!).

catalog.xml is a file familiar to me. From my previous post I knew there was something about blocks defining somewhere and this is it! There are blocks here and I follow the comments and finds Product View.

<block type="catalog/product_view" name="product.info" template="catalog/product/view.phtml">

This was the part I was looking for all the time. You see the template part?. It refers to/app/design/frontend/default/default/template/catalog/product/view.phtml. So I go there open the file and yes htmls!!! product-img-box line is very meaningful what I'm looking for and it has a css class. I make a file search between files and I find /skin/frontend/default/default/css/boxes.css. The product-img-box is defined in it and I change the float:left; to float:right;.

I open my web browser, open a product page and see that images are at right and not at left. You may have been more lucky if you just looked with firebugand saw the css and changed to it. But you wouldn't had gained the insight you would have gained with this.

I hope that this was helpful. I'm not an expert on Magento. This article on Magento wiki helped me to figure out something. My previous post's references were also valid. Do not forget to keep watching Magento Wiki and Magento Forums for best resources about Magento.

How To Create CSS Image Buttons In Your Magento Themes

Many developers and store owners don’t like to use images as buttons simply because they do not wish their users to wait until the images load. Image buttons gives the flexibility to display images as per store’s requirement but these days lots and lots of stores are opting to create CSS image buttons rather than image buttons. With a very little tweak you can get rid of image buttons in your theme and switch to CSS buttons. If you are willing to change your image buttons to CSS powered buttons then follow the steps given below:

Take a nice background image which is blank and nothing written on it. We will use this background image to generate text over it. Basically, if you follow CSS buttons you don’t have to create separate images for each button. Download the background image given below for an example (you can create your own image background).

 

In your theme template you will find various instances where you have to change image button to CSS button. For an example we will take “Proceed to Checkout” button code app/design/frontend/default/Your_theme/template/checkout/onepage/link.phtml

By default you will see something like this (if you are using default theme)

1	<a href="<?=$this->getCheckoutUrl()?>"><img src="<?=$this->getSkinUrl('images/btn_proceed_to_checkout.gif')?>" alt="<?=__('Proceed to Checkout')?>"/></a>

Now, we will use CSS and HTML to tweak and change the background for this button.

1	<a class="css-button btn-checkout" href="<?php echo $this->getCheckoutUrl()?>"><span><?php echo Mage::helper('checkout')->__('Proceed to Checkout');?></span></a>

Note: if you are using v 1.7 then change like this

1	<a class="css-button btn-checkout" href="<?php echo $this->getCheckoutUrl()?>"><span><?php echo $this->__('Proceed to Checkout')?></span></a>

You will notice that we have called css-button class along with btn-checkout which will enable us to change font color or size later if needed. Your CSS button is ready. Now, lets write the CSS for this button

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

.btn-checkout { display:block; float:right; background:transparent url(../images/btn_proceed_to_checkout_rad.gif) no-repeat 100% 0; font-size:15px; font-weight:bold; padding-right:8px; } .btn-checkout, .btn-checkout:hover { color:#fef5e5; text-decoration:none; } .btn-checkout span { display:block; padding:0 17px 0 25px; background:transparent url(../images/btn_proceed_to_checkout_bg.gif) no-repeat; line-height:40px; }

You are done, your CSS button is ready, just clear your cache and see the CSS button.

Similarly, you can change the buttons of other instances like Add To Cart etc. E.g.app/design/frontend/default/your_theme/template/checkout/onepage/review.phtml

change this

1	<input type="image" src="<?php echo $this->getSkinUrl('images/btn_place_order.gif') ?>" onclick="review.save();" value="<?php echo $this->__('Place Order') ?>" />

To

1	<a class="css-button btn-checkout" href="#" onclick="review.save();"><span><?php echo $this->__('Place Order') ;?></span></a>

Changing image buttons to CSS buttons is an easy task if you follow the steps given above but make sure that you switch to all instances of image buttons to CSS one’s otherwise your store might look awkward. Please leave me a comment and let me know if this trick helped you to convert your Magento store image buttons to CSS buttons. Don’t forget to subscribe our RSS to receive latest updates delivered to your mailbox.