{"id":1889,"date":"2010-11-15T10:25:00","date_gmt":"2010-11-15T15:25:00","guid":{"rendered":"http:\/\/mts-help.nick.php.dev\/after_sale_support\/Working_with_CRE_Loaded\/engine_description\/article7.html"},"modified":"2011-03-23T03:41:32","modified_gmt":"2011-03-23T07:41:32","slug":"the-infoboxes","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/the-infoboxes.html","title":{"rendered":"The Infoboxes"},"content":{"rendered":"The infoboxes are the interface elements that combine one kind of information only. Any infobox has both the heading and the content. Below is the sample of such a heading and the part of the info box.\r\n<table style=\"height: 213px;\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" width=\"235\" align=\"center\">\r\n<tbody>\r\n<tr>\r\n<td><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/specials.jpg\" alt=\"\" width=\"180\" height=\"211\" \/><\/td>\r\n<td height=\"213\" valign=\"top\">\r\n<table style=\"margin-top: 15px; margin-left: 5px; height: 100%;\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" width=\"100\">\r\n<tbody>\r\n<tr>\r\n<td height=\"25\">The Heading<\/td>\r\n<\/tr>\r\n<tr>\r\n<td width=\"188\">The Content<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\n<\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>\r\nThe <span style=\"font-weight: bold;\">boxes.tpl.php<\/span> file contains the classes for the information output. The kit of any kind of class gives out the table with the parameters and the content that is further on passed to the class kit. So far as any infobox consists of the heading and the content, for the output accordingly it uses two classes \u2013 <span style=\"font-weight: bold;\">&#8220;infoBoxHeading&#8221;<\/span> and <span style=\"font-weight: bold;\">\u201cinfobox\u201d<\/span>. Taking into account that infoboxes can be of different design it is in need to use different type classes for the output. In order to fulfill this there is a mechanism of inheritance so that the standard class is inherited several times under different names.\r\n\r\nThe Infoboxes are divided into several types:\r\n\r\n&#8211; The string data (Categories, Bestsellers, Information, FAQ, Affiliate, Info pages, Articles, Shopping cart, Links, Who is online);\r\n&#8211; Products (Featured, Specials, Reviews, Latest products);\r\n&#8211; The input blocks\u00a0 (Select template, Quick Find, Manufacturers, Currencies, Advanced search, Tell a friend, Languages, My account).\r\n\r\nBelow is the list of all the standard infoboxes:\r\n<table border=\"1\" cellspacing=\"0\" cellpadding=\"0\" width=\"758\" align=\"center\" bordercolor=\"#000000\">\r\n<tbody>\r\n<tr>\r\n<td style=\"text-align: center;\" bgcolor=\"#cccccc\"><strong>Infobox Name<\/strong><\/td>\r\n<td width=\"200\" bgcolor=\"#cccccc\">\r\n<div><strong>Image<\/strong><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\" bgcolor=\"#cccccc\"><strong>Data Type<\/strong><\/td>\r\n<td width=\"300\" bgcolor=\"#cccccc\">\r\n<div><strong>Description<\/strong><\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Categories<\/strong>\r\n(the category box)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/categories.jpg\" alt=\"\" width=\"182\" height=\"361\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">Outputs the list of links for the category products.\r\nThis box is the compulsory one in the template.<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Bestsellers<\/strong>\r\n(the box of the most popular products)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/bestsellers.jpg\" alt=\"\" width=\"182\" height=\"97\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">Outputs the list of links for the best selling products.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Information<\/strong>\r\n(the links to sub-pages box)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/information.jpg\" alt=\"\" width=\"188\" height=\"148\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">Outlines the list of links for the sub-pages.\r\nHas the next points:\r\n<span style=\"text-decoration: underline;\">Terms and Conditions\r\nShipping and returns\r\nPrivacy\r\nNew Item Step 1\r\nGift Voucher FAQ\r\nFAQ\r\nLinks\r\nContact Us<\/span><\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>FAQ<\/strong>\r\n(Frequently Asked Questions)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/faq.jpg\" alt=\"\" width=\"183\" height=\"108\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">Outlines the list of links to the frequently asked questions<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Affiliate Info<\/strong>\r\n(the Affiliate info box)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/affiliate_info.jpg\" alt=\"\" width=\"184\" height=\"96\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">Has a list of two links to the affiliate links pages.\r\n<span style=\"text-decoration: underline;\">Affiliate Information<\/span>\r\n<span style=\"text-decoration: underline;\">Affiliate Log In<\/span><\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Info Pages<\/strong>\r\n(the box of links to the non-standard sub-pages)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/info_pages.jpg\" alt=\"\" width=\"184\" height=\"68\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">Contains the list of links to the pages added by user.\r\nOn default contains one Company Info link.<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Articles<\/strong>\r\n(the box of links added by user)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/articles.jpg\" alt=\"\" width=\"186\" height=\"91\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">By default contains two links: \u201cNew Articles\u201d and \u201cAll Articles&#8221;<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\" rowspan=\"2\"><strong>Shopping cart<\/strong><\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/shopping_cart.jpg\" alt=\"\" width=\"185\" height=\"64\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" rowspan=\"2\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div>On default (when the cart is empty) contains text 0 items.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/shopping_cart_full.jpg\" alt=\"\" width=\"186\" height=\"153\" \/><\/div><\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">If the shopping cart has any kind of products it gets to the following view.\r\nThe Box contains the list of products which are currently in the shopping cart and in the very end there is the total sum of money calculated to pay for the cart\u2019s entry.<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Links<\/strong>\r\n(the box of links to the external resources)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/links.jpg\" alt=\"\" width=\"184\" height=\"95\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">The Box consists of the number of links to the external resources.\r\nBy default, it has two links: 2nd Category, CRE Loaded<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Who is online<\/strong>\r\n(the box reflects to the number of visitors)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/whos_online.jpg\" alt=\"\" width=\"184\" height=\"80\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">\r\n<p style=\"text-align: center;\">String<\/p>\r\n<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">The box contains the text &#8220;currently there is 1 guest online&#8221;<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Featured Products\r\n<\/strong> (The box of presented products)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/featured.jpg\" alt=\"\" width=\"186\" height=\"198\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Product<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">The box shows the product image, its name and price.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Specials<\/strong>\r\n(The box contains one of the products from the &#8220;special offer&#8221; list)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/specials.jpg\" alt=\"\" width=\"180\" height=\"211\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Product<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">The box shows the product image, its name and price.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Product Reviews<\/strong>\r\n(The box contains the product with the visitors\u2019 opinion for it)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/product_reviews.jpg\" alt=\"\" width=\"183\" height=\"187\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Product<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">The box has the product image, part of the text description, and the rating to the rank of 5.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Latest Product<\/strong>\r\n(The box contains the product from the list of &#8220;latest arrivals&#8221;)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/latest_product.jpg\" alt=\"\" width=\"184\" height=\"183\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Product<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">The box shows the product image, its name and price.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Quick Find<\/strong>\r\n(Box search by product)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/quick_find.jpg\" alt=\"\" width=\"183\" height=\"105\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Input box<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">The box has an input field, search button, the text: &#8220;Use keywords to find the product you are looking for&#8221; and the text Advanced Search link. The text and the link &#8220;Use keywords to find the product you are looking for&#8221; and an Advanced Search link which are optional.<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Manufacturers<\/strong>\r\n(the list of manufacturers)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/manufactures.jpg\" alt=\"\" width=\"184\" height=\"94\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Input box<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">The list contains a drop down box.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Currencies<\/strong>\r\n(the list of currency)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/currencies.jpg\" alt=\"\" width=\"184\" height=\"74\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Input box<\/td>\r\n<td width=\"300\">\r\n<div style=\"text-align: center;\">The list contains a drop down box.<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Advanced Search<\/strong>\r\n(the box of site and product search)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/advanced_search.jpg\" alt=\"\" width=\"185\" height=\"113\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Input box<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">The box has an input field, search button, the text: \u201cUse keywords to find the product you are looking for\u201d and the text Advanced Search link. The text and the link \u201c Use keywords to find the product you are looking for\u201d and an Advanced Search link which are optional.<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<tr>\r\n<td style=\"text-align: center;\"><strong>Languages\r\n<\/strong> (Localization Box)<\/td>\r\n<td width=\"200\">\r\n<div><img loading=\"lazy\" src=\"..\/..\/..\/img\/cre\/languages.jpg\" alt=\"\" width=\"185\" height=\"86\" \/><\/div><\/td>\r\n<td style=\"text-align: center;\" width=\"80\">Input box<\/td>\r\n<td width=\"300\">\r\n<div>\r\n<p style=\"text-align: center;\">Contains the icons that represent the flags of the countries localisations.<\/p>\r\n\r\n\r\n<\/div><\/td>\r\n<\/tr>\r\n<\/tbody>\r\n<\/table>","protected":false},"excerpt":{"rendered":"<p>The infoboxes are the interface elements that combine one kind of information only. Any infobox has both the heading and the content. Below is the sample of such a heading and the part of the info box. The Heading The Content The boxes.tpl.php file contains the classes for the information output. The kit of any [&hellip;]<\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[285,730,719],"tags":[597,590,558],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1889"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=1889"}],"version-history":[{"count":0,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1889\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=1889"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=1889"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=1889"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}