Contents. Installing the module

Transcription

1 Here is a very comprehensive tutorial for managing Prestablog. This way, you'll have all the necessary information close to hand for correctly managing and ensuring good SEO for your articles. Contents Installing Updating Configuring 1. Themes and slideshow 2. Blog home page 3. List of custom articles (articles on home page of your shop) 4. Categories menu 5. Managing blocks 6. Comments 7. Rewrite 8. General configuration 9. «Blog» link in the top horizontal menu 10. Admin users access Managing content 1. Managing categories 2. Managing articles 3. Adding an article 4. Managing languages in an article 5. Main article heading 6. Enabling/disabling an article 7. Displaying articles in a slideshow 8. Comments on an article 9. Ensuring a good SEO for an article 10. Main image (slide, article, categories etc.) 11. Content to be included in the introduction 12. Main content 13. Selecting categories 14. Linked products 15. pictures quality (PS 1.6) Tools 1. Antispam for comments made to your blog 2. Importing your articles from wordpress 3. Sitemap Installing the module Tip: Always remember to create a backup of your database when you are installing or updating a module. To install this module, you just need to go to your backoffice and to send the file that you have just downloaded. (Do not use your FTP). To send the file, click on the button "add new module" in the top right hand corner of your interface. Then click "Browse" to locate your file and send it. Then click on the install button located to

2 the right of the module's name. If you are not automatically redirected to the module, use the tab that was just created in your quick access list to directly access the blog. If you have an issue for uploading the zip, your hosting is probably limiting this. For correct this, just modify the value above in your php.ini on your hosting. memory_limit = 32M upload_max_filesize = 24M post_max_size = 32M You have access to a new interface with 5 tabs and information relating to your newly installed blog. (comments pending, latest articles, statistics) Don't forget to disable the cache option in your boutique and to regenerate the tpl files so you can see all the changes made by the module. To do this, go to your backoffice: Advanced setting > PerformanceTemplate cache: Enable Force compilation each time in Cache: Disable the option and click on clear the Smarty cache. Don't forget to change the options back to how they were before once the module is installed and the template is how you want it. After installing, if you have a 404 error on the front office, It's generaly come from a module or old wordpress badly uninstalled. Verify if : You don't have allready a blog folder on your ftp your htaccess (must not have any blog mention) if an old blog is correctly uninstalled. if there is not any htaccess file in the modules folder with blog mention in it. Updating your blog to a newer version

3 Since the release of version 3.6 of our module, updates have been automatic. However, before installing any upgrade, and the same applies for all the other modules, it is still important to make a backup of your database and files just in case. This way, you can undo any changes if a technical issue arises. Configuration Themes and slideshow Blog home page List of custom articles Categories menu Managing blocks Comments Rewrite General configuration «Blog» link in the top horizontal menu Admin users access Themes and blog slideshow Chose your blog template On prestashop 1.6 or 1.5, this section includes two templates, the default template available with the current version of prestashop (1.6) and a second template that is compatible with prestashop version 1.5. On prestashop 1.7, you have only one template. If you have a multi-boutique, this section will also help you to manage each of your themes separately and provide different layouts. To do this, you just need to duplicate the files situed in >> Module> Prestablog > views > css > grid-for-1.x-module.css >> Module >Prestablog > views > hook & front. (All files with the name of the template you want to duplicate.) You can rename each of the themes as you like, they will appear directly in the theme-selection drop-down list. With respect to integrating the blog into your front office, you may, in some cases, experience bugs related to your file global.css, which has probably been modified incorrectly, i.e. without respecting development norms. You may therefore need to adjust some of the styles. We therefore recommend that you use your developpment tool (F12 on your browser) to identify which CSS classes need changing. There are some excellent tutorials available on how to use it. Configuring the slideshow You can choose to enable it (or not) on the home page on the blog page or on both these pages In the section main images, you will see how to know the width of your content, which, in all logic, will need to be the same as the width of your slideshow. However, you can also determine the width by using a tool like your development tool see previously. Once you have obtained this value, set the width of your slideshow, as well as the height. This will systematically be used when you publish an article, so you can put your news on the front page. Please note, if you change the width after having written your articles, you will need to regenerate the images for them to be the right size. (Do not directly change them on your ftp, the crop function will not work properly afterwards if you do, because it has already saved the original dimensions).

4 If you have problem with the quality of your pictures, verify in your prestashop configuration appearences > pictures if the quality of the compression jpg is enough. Creativ Slider, available on version 1.7 only Happy owners of the CreativSlider module, you can now integrate your slides directly on the blog home and, even better, directly into your content using the shortcode provided on your favorite slideshow. Just go to an article, and directly in the content, paste your shortcode example: [creativeslider id="1"] If you want to replace the slideshow of our blog with this one, go to the configuration > Theme and Slide. On the left side of the page, find the "Slide settings" part of the "Creative Slider" module and choose a slide from the list provided. Don't forget to disable the blog slide, otherwise, you will have two slides on your homepage. List options Length of title refers to the maximum number of characters you can use for the slideshow name. Length of introduction refers to the maximum number of characters you can use for the slideshow (this is not used in the responsive version). Blog Home Page This part allows you to manage the blog's heading tag and find the url so you can add it where you need it (e.g.mega menu). List of custom articles For the purposes of your boutiques, and/or SEO, you may need to display information from the blog on your home page or elsewhere in one of your tpl files. Then this tool is made for you. If you wish to use this feature, it first needs to be enabled. Click on the «create a list» button. You can then decide what information you want to display, you have the possibility to indicate a specific time-window, if for example, you want to promote a certain category on your blog for a marketing operation For Hook, you can choose 3 different methods,

5 the first, DisplayHome, will display your list on your home page, the second DisplayCystomHook will allow you to embed code directly into one of the tpl files in your boutique template, allowing you to display a list (which you will need to create beforehand) (e.g.: {hook h = 'displayprestabloglist' id = '2' mod = 'prestablog'} inside product.tpl) As for the 3rd, it allows you to add a statistics insert on your blog's admin homepage. (Latest article with the most or fewest comments, the most or least read). Very handy for seeing your blog stats at a glance. Categories

6 If you haven't added any columns in your template, it is very useful to add the blog containing the article categories to allow your users to navigate between the blog's pages. In this case, we recommend you enable this option on all your blog's pages. It's really up to you. The options available allow you to really personalize your blog, whatever way you like. Please note, displaying the description may generate duplicate content on your site, so it is better not to enable this option, or at least, to use the least possible no. of characters so as to limit the effects. (SEO Tip) Since the release of V3, you can now configure the category menu located at the top of the blog. You can add a horizontal menu which lets you navigate 1-column sites more easily. Of course,

7 it can also be used with sites with multiple columns. And obviously, you can also disable it. For these two menus (block menu and top of blog menu), it is not recommended to display empty categories, as this will not aid SEO (SEO Tip) One of the new features of V3 is also the ability to personalize your category with an image, a description, and above all, a h1 tag which can be optimized for SEO (SEO Tip). Be sure to enter the right width so you don't lose image quality. (see the tips in the tutorial images section for help in finding the right size if you experience any difficulties) Managing blocks If your template does not have any columns, then this section will not be of much interest to you. Blocks are displayed within the columns (hook_right and hook_left). However, you can also enable the latest articles in the footer if you like. Latest articles block

8 If you enable this block, you will see the last articles posted in the right hand side or left hand side column. You can enable (or not) the button to access all the articles, what is in actual fact the index of your blog Block articles by date This block displays links to archives in order of year. RSS block for all articles This block allows users to follow your blog by means of a feed aggregator. (Learn more about RSS feeds) Latest posts in footer This is a perfect block if you don't have any columns allowing your visitors to link to your latest posts from any page on your site. In terms of SEO, it also allows you to add a little extra juice to your recent publications. Arranging blocks within columns Drag & drop each block on the left or right hand side column. (Hook_left or Hook-right) Arranging blocks in relation to other block modules If you want to change the position of your blocks in relation to the other modules (for example, the best sellers block ), just go to Modules > Positions. Find where it says displayleftcolumn or displayrightcolumn and change the position of prestablog by dragging & dropping or by using the arrows designed for the purpose. If you don't want for certain of your boutique's blocks to appear on the blog: still on the Positions page, edit the block you want to make disappear and in exceptions, look for the value «module-prestablog-blog» (without the quotation marks), then select and save. Configuring comments Since version 3.6 of our module, you can now, use facebook comments. For moderating comments rendez-vous on If you don't have activ account, click on the top right corner on add a new apps. Follow instruction of facebook. Therefore, return to your back-office, enter the API number you just copy from facebook.

9 This module, which is simple to configure, allows you to manage the comments whatever way you like. When the option «always see comments» is disabled, a javascript button must be clicked for them to be displayed, which could be useful for some purposes. The option Auto-approve is really not recommended. Nofollow link, some people prefer not to allow a Google juice value to be afforded to their users' comments, but it is a matter of personal choice. This does not mean the juice is lost, kust that it is not passed on. (juice: power or value afforded to a link to indirectly improve search engine ranking) There is no need to explain everything else in greater detail, the indications provided in the module are quite suffice. Enabling rewrite Go to the blog's configuration tab, then click on the rewrite tab to access the enable button. This has to be done if you want to make your blog SEO-friendly and allow search engine robots to correctly navigate your blog with cleaner URLs. Once enabled, there is nothing else you need to do.* Do not disable this option once your site is up and running, otherwise your site will generate a lot of 404 errors, which will have a negative effect on your search engine ranking.

10 General configuration Here you will find all the general configuration settings in your front office, including the number of articles you would like to display on your pages. The minimum is 5, but we generally recommend between 5 and 10. Here, you can add a tab in the products pages with a link to your articles. Enable or disable sharing options for social networking + Google, facebook and twitter. Article list options In this part, you can configure the thumbnails that will be displayed alongside your article list. This is extremely useful when the size (height/width) of your blog is different from the original template. We would strongly suggest you configure this option anyway before adding your articles, so as not to have to regenerate all the images later. Administrator setup The section to the right allows you to organize your blog in whatever way you feel is the most practical for displaying the info. It may be better to display more or fewer articles. «Blog» link in the top menu If you want to delete the link that appears in the horizontal top menu of prestashop, just go to the section modules > positions; look for where it says «hookdisplaynav» and delete prestablog. If you would like to add this link, do the opposite. Admin user access If you need to give some special access only for blog to some users, simply go to your permission panel in your prestashop backoffice and check these line : Modules & services (display/modify)

11 Prestablog in the menu column (display/modify) Prestablog on the right column modules (display/configure) Managing content Managing categories Managing articles Adding an article Managing languages in an article Main article heading Enabling/disabling an article Displaying articles in a slideshow Comments on an article Ensuring a good SEO for an article Main image (slide, article, categories etc.) Content to be included in the introduction Main content Selecting categories Linked products Pictures quality (PS 1.6) There are 3 tabs: Articles, Comments, Categories. Before doing anything else, it would probably be a good idea to create your categories. Managing categories Click on the button to add a category. The 1st field is for the name of your category, the second for the category level (parent or child category). There are no level limitations in the sub-categories, you can go up to 4, even 5 levels, but we would not really recommend it. Users are not likely going to enjoy having to navigate a menu with a lot of levels. Preferably opt for a menu with no more than 2 levels (a parent category containing a sub-category which in turn contains its own sub-categories). You can then add an image set to the right size (see section category in the configuration menu on how to find the right size.) As is the case for slideshow images, it is important to ensure your images have been sized to the right dimensions to prevent your server from having to rescale the images, resulting in a loss of image quality. By returning to the category after you have confirmed insertion, you can adjust the various image formats. (a thumbnail for the blocks or a large image for the top of the category list or blocks)

12 With the enable or disable button, you can disable an entire category. For SEO purposes, we do not recommend doing this as it could jeopardize the work that you have done thus far by disabling some of your posts. Unless of course they already exist elsewhere in other categories. Arranging your categories To arrange your categories in the order you would like, simply click on the tab at the top of the list: To arrange the categories, you then just need to drag / drop the different categories in the order you want them to appear and to update the configuration by saving your changes. Permissions group Like in your product categories, prestablog allows you to restrict access to certain group. Simply, when you create a category, choose the group that will have access.

13 Managing articles Via this page, you can manage the articles you have already posted or add a new post. Feel free to use the available filter if necessary. This way, you can enable or disable a specific post quickly, or even publish it directly in your blog page's slideshow (or home page depending on your site's configuration, see configuration) Adding an article

14

15

16 This is what the interface looks like, which you can access by clicking on the tab add an article. Managing languages You will quickly find that you can publish an article in a single language or alternatively choose to pair your article. This is very convenient when you do not have the possibility to translate your articles for example. Main heading The heading of the article must be explicit with respect to its content, and neither too long nor too short; it will allow your clients to quickly see the subject of discussion in your article. This is also important in terms of your SEO because it is a H1 tag (level-1 heading tag), and it should therefore contain some of the main key words (do not overdo it either, Google does not like it when people over-optimize). Enable or disable an article These radio buttons let you choose whether your article can be accessed or not; it allows you to come back to your article if you have not finished it or to disable it for any reason. However, with respect to SEO, it is advisable to keep an article (i.e. not delete it) even if this means modifying it, so as not to generate a 404 error message (deleted page). Slideshow Here, you can decide whether your article will made to stand out in your slideshow (see section configuration/setup) Comments You can view the comments of your article at a glance, handy for moderating or reviewing the related threads. To build up the comments interface, simply click on Preparing your article to ensure a good SEO URL rewrite

17 If your article has not yet been published, you may decide to change its url. It is advisable to make the url as short as possible by deleting any words that aren't important (of, the, and, and so on). Aim for a url with 3 or 4 words max. If your article has already been published, you will not be able to change the url without first having clicked on the button «enable url rewrite». However, this would generate a 404 error message, which search engines do not particularly appreciate as a rule. Be careful to make sure you charge the url before your article is indexed by search engines. Meta title The Meta title is important for your site's SEO. Be careful to make sure you do not exceed 70 characters and do not use a series of key words, preferably opting for a simple sentence containing a few of your main keywords. Meta description This is not important in terms of your search engine ranking, but it is still very useful for optimizing the number of clicks in search engines. Do not forget that with an appealing phrase, you encourage users to click. Meta keywords Even though it is possible to personalize key words, we suggest that you do not spend a lot of time focusing on key words, which are now of little use for search engines. Of course, for each of the elements in your article, you can optimize them for each of the different languages chosen. Main image This image is important for your blog, it is displayed: in the categories on the slideshow in latest posts blocks in your linked products pages It is therefore important to a select an attractive picture, and especially one that is the right size! Example: Your content is 800px (pixels) wide, if you upload a picture that is 400px, your server will have to resize it, i.e. blow it up, which will degrade the image quality. Be careful to make sure you use the correct minimum width: 800px. Too large a size is not recommended either because this might also lead to the image being degraded

18 (all depending on the settings used by your hosting service provider). So preferably use the exact size. (Photoshop tutorials) How to know the width of your content When you have uploaded an image and it is visible in your slideshow, go to your frontoffice, using firefox, right click on the image and then View image info. You will then see the dimensions in pixels. If you resize the image, use these values. These dimensions will also be useful for managing your articles and making beautiful professional-looking layouts. They will also be useful for configuring your slideshow. If you only want to use a certain part of the image, remember you can easily crop the image using the tool available. Choose the thumbnail, hold the mouse down on the image, a rectangle frame will appear, place it where you want on your image, and then click resize Moving on to the content, starting with the introduction This text will be seen in articles pinned on the slideshow but also in your categories and the different locations where you want an article to appear (left and right hand side columns, footer, articles linked to a product) Now for the main content Make a real effort! Write an article that is unique, any copy & pasted content is bad for your SEO. Whether it is located on your site or on an external source, there must only be one version of your text, otherwise it will be detrimental to your page, or even worse if the text is repeated too often, it will be damaging to your entire website! (not to mention issues relating to copyright etc..) The same options are available as for your product pages. Let's focus on the essential, the text, layout and images. An article without any images is much less interesting for your visitors, so, why not use lots of them! The page layout It should be punctuated by titles, and the different elements should be adequately spaced out. (The same applies to this article). Each title or heading has a particular level depending on its importance and where it belongs in your article. H1 = Heading of the document (also used for the main heading at the top of your page) H2 = second level heading

19 H3 = third level heading (always after a h2 tag) Etc. After that, there are h4, h5, h6, but it is rare that you would need to use them. For example, this article went up to h5 tags! Do not forget either that you can use bold, bullet lists etc. Tip: Do not use functions like text colours, avoid copying & pasting from word on any OS, as this generates code that should not be on a website. As a general rule, use the same styles as in your template, don't add any, as it is bad for the uniformity and consistency of your site. Adding images to your article To add one or more images, click on the appropriate icon in your wysiwyg tool. (see the screenshot below Insert/edit image) For an attractive-looking layout for your article, I'd suggest you use the same width for your content (we saw earlier how to find the width using the main image). Aligning an image to the left or to the right If, however, you need to align an image to the left or to the right, you'll need (for versions < prestablog 3.4) to enable an option in tinymce which was not initially included by the prestashop team. Go to the prestablog js file: /modules/prestablog/js/tinymce.inc.1.6.js for prestashop 1.6, and /tinymce.inc.js for version 1.5. Version 1.6: At line 32, add a line and insert: image_advtab: true, Version 1.5: At line 27, add a line and insert: image_advtab: true, an «advanced» tab will then appear whenever you want to add an image. To add margins, just enter a value in both fields: vertical space and horizontal space. You will then need to add an alignment manually, left: float: left; right: float: right; Nothing prevents you then, if you possess the CSS knowledge, from adding other styles. The image below may help you understand a little better:

20 This article is an example for a layout.it may give you some inspiration. Selecting categories You just need to tick the category where you want to see the summary displayed that will link to your article. You can tick several categories. Link an article to products This part allows you to link your articles to your products and vice versa (see section on configuration). It also enhances your internal links, improving your SEO. Type a product name in the table on the right, click on the arrow for the product that you want to link to. Linked items are displayed on the panel on the left. Pics quality (PS 1.6) On presdtashop 1.6, there is a new option, you can select your preferences for the compression of your uploads. Just select preferences > pictures and add the option bellow. Tools

21 Three tools are available, An anti-spam for comments made to your blog A tool allowing you to import your articles from wordpress A sitemap Anti-spam It is simple-to-use: you ask a question, and users must then answer it correctly to be able to post a comment on your blog. If it's a robot and not a human, they will be blocked at this level. You will therefore need to create questions with answers. Nothing could be simpler, just fill in the two fields provided. It is also possible to manage the languages available, do not forget to translate the question/answer, otherwise your real human customers won't be able to answer it. Avoid overly complicated questions Importing from wordpress To import the contents of a wordpress blog directly to the blog module, just go to your wordpress interface to generate an XML file that can be used to import the data. Go to Tools > Export > Select articles. Once the file has been generated, save it, go to your prestashop backoffice, and import the file. You can also choose the

22 importing language. You'll then see that your articles have been successfully imported, keeping your content and images, the same URL, meta-tags, publication date, etc. The import process even creates any missing categories. Now all you have to do is update the image displayed on your front page and to confirm the article. Be careful not to leave both blogs online, you may have problems with Google and duplicated content. Sitemap You may need to use the sitemap in order to improve the indexing of your blog. The sitemap is fairly easy-touse, it includes several sitemaps- one for each of your categories- within a single master file. This is designed to reduce the load on the server should you happen to have a very large blog. However, if your blog doesn't have many articles, the sitemap will probably be of little use to you. You can set up a cron job using the cron job editor module provided free of charge by prestashop. The sitemap updates itself automatically. Be careful not to indicate too short a time period, especially if you don't write a lot of articles in a day as it would serve little use and utilize resources for nothing. Don't forget to indicate the URL of the master sitemap in your webmaster tool (it contains all the others) provided in the configuration, otherwise, it will be pointless :-). Concerning the file robots.txt, you may have opted to prevent the system from indexing the modules folder /, in which case, you will need to add the following line: Allow: / modules/prestablog Modification of the column design You can configure on different designs directly in the global configuration of the blog. Go to the "General configuration of the front-office" section 2nd line to choose the number of columns to display in your listing. Remember to adjust the default number of items as well.