Lets say you have a drupal 7 installation with Views enabled. Now you have a view for a products page or a block. Lets say you are not happy with the the fonts, the position or any front end related to the field. How do you overcome this situation. One way is to theme the particular field.
1) In the view, for the field go to the style settings,
a. select customize field HTML
b. select the HTML element like say 'DIV' in this case. Lookup for each and what they mean.
c. select create a CSS class and give it a name say, 'product_title'
d. Finally hit apply. We are done with the ui side of the setup.
2) Now, lets try to customize the field class we defined above for class name 'product_title'
a. You can either pass the full CSS path like below to be specific or the actual element itself making it like more global like.
b. Open you CSS which could be your_theme/css/style.css and add like below.
div.product_title,
.product_title {
align_text: center,
font-size: 1.145em
}
1) In the view, for the field go to the style settings,
a. select customize field HTML
b. select the HTML element like say 'DIV' in this case. Lookup for each and what they mean.
c. select create a CSS class and give it a name say, 'product_title'
d. Finally hit apply. We are done with the ui side of the setup.
2) Now, lets try to customize the field class we defined above for class name 'product_title'
a. You can either pass the full CSS path like below to be specific or the actual element itself making it like more global like.
b. Open you CSS which could be your_theme/css/style.css and add like below.
div.product_title,
.product_title {
align_text: center,
font-size: 1.145em
}
