[Помогите] Проблема с гугл спид и фото на сайте

Тема в разделе "OpenCart", создана пользователем opalko, 1 фев 2016.

  1. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Сайт http://vazon.pp.ua/ в спид тесте показывает проблему с оптимизацией изображений. Но все фото оптимизированы. Дальше догадки - фото доп.изображений справа от основного фото (выводятся в категориях, модуле новинок, популярных) спид тест расценивает как отдельные изображения разрешением 30х30, а в кэше они 258х258, т.е. определённый код и стили уменьшают изображение и спид тест считает что этого можно избежать оптимизировав изображения до 30х30. Как и что в коде можно поправить, если такое вообще можно сделать?
     
  2. MGT1

    MGT1

    Регистрация:
    5 янв 2013
    Сообщения:
    900
    Симпатии:
    218
    попробуй тут прогнать картинки
     
  3. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Спасибо за сервис, но не помог, гугл спид упал с 59 до 55, появились другие заморочки обязательные для устранения, так что пока вернул старые файлы.
     
  4. MGT1

    MGT1

    Регистрация:
    5 янв 2013
    Сообщения:
    900
    Симпатии:
    218
    А ВПС у тебя какой? Или обычный хост?
    55 на мобильной или комп?
    Протестируй rozetka.com.ua через гуглспид (один из элитарных интернет-магазинов по структуре кода и поддержке) - и посмотришь на ихние результаты).
     
  5. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    розетка тратит миллионы в месяц на рекламу и поддержку, с ней равнятся думаю не стоит. У меня обычный бесплатный хост, 55 на компе, мобильный - 46. Не могу сказать что сайт прям сильно тупит, но полностью добавлено всего 2 категории с товарами, а что будет если добавить все товары....
     
    Последнее редактирование: 1 фев 2016
  6. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    Так нельзя делать. Оригинальный размер изображения должен соответствовать размеру на странице, то есть, если на странице это 30*30, то и сам файл должен быть таким же.
    Красным PageSpeed помечает именно это, а не то, что изображения не оптимально сжаты.
     
    opalko нравится это.
  7. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Уважаемый Dotrox, Вы не раз мне помогали, может и в этот раз подтолкнёте в нужную сторону. Я не могу их уменьшить до такого размера, качество фото будет никудышные.
     
  8. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    Вам просто нужно использовать два отдельных файла: один будет миниатюрой сбоку, а ссылка на второй (большего размера) будет подставляться в тег основного изображения при выборе миниатюры. Это и вес страницы заодно уменьшит.

    При чём, у вас именно такой вариант и предусмотрен: у вас для смены основного изображения ссылка берётся из атрибута data-image тега ссылки, в которую обёрнут тег изображения миниатюры.
    То есть, вам всего лишь надо, чтоб в сам тег изображения миниатюры выводилось уменьшенное изображение, а не то же самое, что и в атрибуте data-image.

    Если вы хотите, чтоб я подсказал, что для этого поправить, сразу выкладывайте сюда контроллер и шаблон этого модуля (не ссылками, а скопируйте сам код сюда).
     
    opalko нравится это.
  9. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Это наверное вшито в шаблон, могу дать доступ к ftp, если согласитесь помочь
     
  10. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    Не важно, главное, покажите мне код. Хотя я практически уверен, что это отдельный модуль.

    Бесплатная помощь только через форум.
     
    opalko нравится это.
  11. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Это точно не отдельный модуль, я искал что-то вроде owl-modul или owl-wrapper, но ничего такого нет. Пробовал отключать модули с удалением кеша, но безрезультатно. Может у Вас есть мысли что искать?
     
  12. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    При чём тут вообще owl? Это модуль типа товары в табах или все товары в одном, он должен как-то так называться. Вы его в админке ищите, а не в коде, а потом, узнав название контроллера, уже ищите в коде.

    А если это всё же не модуль, тогда смотрите контроллер главной страницы. Но я не верю, что это может быть туда вшито.
     
    opalko нравится это.
  13. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Спасибо, без Вашей помощи не разобрался, включение доп. изображений в модулях и категориях происходит в модуле настройки шаблона. Контоллер модуля табы
    PHP:
    <?php
    class ControllerModuleUniverTabs extends Controller {
        protected function 
    index($setting) {
            static 
    $module 0;
            
    $this->document->addScript('catalog/view/javascript/jquery/tabs.js');
            
    $this->data['button_cart'] = $this->language->get('button_cart');
         
            
    $this->load->model('catalog/product');
            
    $this->load->model('catalog/popular');
            
    $this->load->model('tool/image');
            
    $this->load->model('catalog/review');
         
         
         
            if (!empty(
    $setting['carousel'])){
            
    $this->data['carousel'] = true
            }else{
            
    $this->data['carousel'] = false;     
            }
         
            if (
    $setting['v_limit']==''){
            
    $this->data['v_limit'] = 3
            }else{
            
    $this->data['v_limit'] = $setting['v_limit'];     
            }
         
     
            
    $this->data['tabs'] = array();
         
            
    $tabs = array();
    //        $tabs = $this->config->get('univer_tabs_tab');
            
    $tabs $setting['tabs'];
            if (isset(
    $tabs)) {
                foreach (
    $tabs as $tab) {
                    
    $results = array();

                    if (
    $tab['filter_type'] == "special") {
                        
    $data = array(
                            
    'sort'  => 'pd.name',
                            
    'order' => 'ASC',
                            
    'start' => 0,
                            
    'limit' => $setting['limit'],
                        );
                        
    $results $this->model_catalog_product->getProductSpecials($data);
                    }
                    if (
    $tab['filter_type'] == "latest") {
                        
    $results $this->model_catalog_product->getLatestProducts($setting['limit']);
                    }
                    if (
    $tab['filter_type'] == "popular") {
                        
    $results $this->model_catalog_popular->getPopularProducts($setting['limit']);
                    }
                    if (
    $tab['filter_type'] == "bestseller") {
                        
    $results $this->model_catalog_product->getBestSellerProducts($setting['limit']);
            }
                    if (
    $tab['filter_type'] == "category") {
                        
    $data = array(
                            
    'filter_category_id' => $tab['filter_type_category'],
                            
    'sort'  => 'pd.name',
                            
    'order' => 'ASC',
                            
    'start' => 0,
                            
    'limit' => $setting['limit'],
                        );
                        
    $results $this->model_catalog_product->getProducts($data);
                    }
                 
                    
    $products = array();
                 
                    foreach (
    $results as $result) {
                     
                    
    $results_img $this->model_catalog_product->getProductImages($result['product_id']);
                    
    $dop_img = array();
                    foreach (
    $results_img as $result_img) {
                    if (
    $result_img['image']) {
                    
    $image_dop $this->model_tool_image->resize($result_img['image'], $setting['image_width'], $setting['image_height']);
                    } else {
                    
    $image_dop $this->model_tool_image->resize('no_image.jpg',  $setting['image_width'], $setting['image_height']);
                    }
                     
    $dop_img[] = $image_dop;
                    }
                     
                     
                        if (
    $result['image']) {
                            
    $image $this->model_tool_image->resize($result['image'], $setting['image_width'], $setting['image_height']);
                        } else {
                            
    $image false;
                        }

                        if ((
    $this->config->get('config_customer_price') && $this->customer->isLogged()) || !$this->config->get('config_customer_price')) {
                            
    $price $this->currency->format($this->tax->calculate($result['price'], $result['tax_class_id'], $this->config->get('config_tax')));
                        } else {
                            
    $price false;
                        }
                             
                        if ((float)
    $result['special']) {
                            
    $special $this->currency->format($this->tax->calculate($result['special'], $result['tax_class_id'], $this->config->get('config_tax')));
                        } else {
                            
    $special false;
                        }
                     
                        if (
    $this->config->get('config_review_status')) {
                            
    $rating $result['rating'];
                        } else {
                            
    $rating false;
                        }
                        
    $products[] = array(
                            
    'product_id'   => $result['product_id'],
                            
    'model'        => $result['model'],
                            
    'thumb'          => $image,
                            
    'name'           => $result['name'],
                            
    'price'          => $price,
                            
    'special'        => $special,
                            
    'saving'     => round((($result['price'] - $result['special'])/($result['price'] + 0.01))*1000),
                            
    'dop_img' => $dop_img,
                               
    'quickview'        => $this->url->link('product/quickview''product_id=' $result['product_id']),
                            
    'rating'       => $rating,
                            
    'reviews'      => sprintf($this->language->get('text_reviews'), (int)$result['reviews']),
                            
    'href'           => $this->url->link('product/product''product_id=' $result['product_id']),
                        );
                    }
                 
                 

                    if ((
    $tab['title'][$this->config->get('config_language_id')] =='') || ($tab['title'][$this->config->get('config_language_id')] =='Enter the name')){
                     
                            if (
    $tab['filter_type'] == "special") {$title 'Special';}
                            if (
    $tab['filter_type'] == "latest") {$title 'Latest';}
                            if (
    $tab['filter_type'] == "popular") {$title 'Most Viewed';}
                            if (
    $tab['filter_type'] == "bestseller") {$title 'Bestseller';}
                            if (
    $tab['filter_type'] == "category") {
                                
    $category_name $this->model_catalog_category->getCategory($tab['filter_type_category']);
                                if (isset(
    $category_name['name'])) {
                                
    $title $category_name['name'];
                                 } else {
                                 
    $title false;
                               }}
                             

                        } else {
                        
    $title $tab['title'][$this->config->get('config_language_id')]; 
                        }
             
                    
    $this->data['tabs'][] = array(
                            
    'title'              =>    $title,
                            
    'products'   => $products
                        
    );
                }
            }
         
         
            
    $this->data['module'] = $module++;
                 
            if (
    file_exists(DIR_TEMPLATE $this->config->get('config_template') . '/template/module/univer_tabs.tpl')) {
                
    $this->template $this->config->get('config_template') . '/template/module/univer_tabs.tpl';
            } else {
                
    $this->template 'default/template/module/univer_tabs.tpl';
            }

            
    $this->render();
        }
    }
    ?>
    и шаблон
    PHP:
    <?php if(!empty($tabs)){ ?>
    <?php
    $this
    ->language->load('module/category');
    $button_compare $this->language->get('button_compare');
    $this->language->load('module/univertheme');
    $button_quick $this->language->get('entry_quickview');
    $this->language->load('module/fast_order');
    $text_order $this->language->get('text_order');
    ?>

    <div id="univer_tabs<?php echo $module?>" class="htabs univer_tabs">
        <?php $numTab 1?>
         <?php foreach ($tabs as $tab) { ?>
         <?php if ($tab['title']) { ?>
          <a href="#tab-<?php echo $numTab?><?php echo $module?>"><?php echo $tab['title']; ?></a>
          <?php ?>
         <?php $numTab++; ?>
        <?php ?>
    </div>

    <?php $numTab 1?>
    <?php 
    foreach ($tabs as $tab) { ?>
    <div id="tab-<?php echo $numTab?><?php echo $module?>" class="box-product-category tabs_module">
      <div class="box">
          <div class="box-content">
            <div class="box-product">
         
             <?php if($carousel){ ?><div class="owl-addimage owl-carousel"> <?php ?>
              <?php if(!empty($tab['products'])){ ?>
              <?php foreach ($tab['products'] as $product) { ?>
               <div class="itemcolumns">
                 
            <!--hover object-->           
            <?php if ((isset($product['dop_img'])) && ($this->config->get('img_additional1') == '1') && ($product['thumb'])) { ?>
            <?php $i=1; if ($product['dop_img']) { ?>
            <div class="owl_modul">           
                             
                                <div data-index="0">
                                  <a title="<?php echo $product['name']; ?>" data-image="<?php echo $product['thumb']; ?>">
                                   <img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" ></a>
                                </div>
                             
                             
                               <?php for ($key 0$key 3$key++) { ?>
                               
                                <?php if  (!empty($product['dop_img'][$key])) { ?>
                                <div data-index="<?php echo $i?>">
                                    <a title="<?php echo $product['name']; ?>" data-image="<?php echo $product['dop_img'][$key]; ?>">
                                    <img src="<?php echo $product['dop_img'][$key];?>" alt="<?php echo $product['name']; ?>" ></a>
                                </div>
                                  <?php ?>
                           
                                <?php  $i++; } ?>
                    </div>
                    <?php ?>
                    <?php ?>
           
           
       <!--end hover object-->

                    <?php if ($product['thumb']) { ?>
                    <div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></a>
                 
                    <?php if  ((isset($product['quickview'])) && ($this->config->get('quick_view') == '1')) { ?>
                    <div class="quickviewbutton"><a class='quickview' href="<?php echo $product['quickview']; ?>" title="<?php echo $button_quick?>"><?php echo $button_quick?></a></div>
                    <?php ?>
                 
                    </div>
                    <?php ?>
                 
                     <?php if ($product['special']) {
                     if (isset(
    $product['saving'])) { ?>
                     <div class="savemoney">- <?php echo $product['saving']; ?>%</div>
                     <?php } } ?>


                 
                  <div class="name"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></div>
                   <?php if ($product['price']) { ?>
                   <div class="price">
                   <?php if (!$product['special']) { ?>
                   <?php echo $product['price']; ?>
                   <?php } else { ?>
                   <span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
                   <?php ?>
                   </div>
                   <?php ?>
                 
                 
                   <div class="cart"><input type="button" value="<?php echo $button_cart?>" onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button" /></div>

                    <div class="hover_but">
                    <?php if ($this->config->get('univer_fastorder') == '1')  { ?>
                   <div class="singleclick_wrapper"><a class="singleclick" title="<?php echo $text_order?>"><?php echo $text_order?></a></div>
                   <?php ?>
                   <?php if ($this->config->get('show_compare') == '1')  { ?>
                   <div class="compare"><a onclick="addToCompare('<?php echo $product['product_id']; ?>');"  title="<?php echo $button_compare?>"></a></div>
                   <?php ?>
               
                   </div>
                  <?php if ($this->config->get('config_review_status')) { ?>
                   <div class="rating"><img src="catalog/view/theme/univer/image/stars-<?php echo $product['rating']; ?>.png" alt="<?php echo $product['reviews']; ?>" /></div>
                   <?php ?> 

                 
                 
              </div>

                  <?php ?>
              <?php ?>
             <?php if($carousel){ ?></div> <?php ?>
            </div>
          </div>
      </div>
    </div>
    <?php $numl1 $v_limit 1;
          if (
    $v_limit 2)  {
          
    $numl2 $v_limit 2;
          } else { 
    $numl2 1;}
    ?>
    <script type="text/javascript"><!--
           $("#tab-<?php echo $numTab?><?php echo $module?> .owl-addimage").owlCarousel({
          navigation : true,
          pagination : false,
          items      :<?php echo $v_limit?>,
           <?php if ($this->config->get('gen_responsive') == '1') { ?>
                    itemsDesktop             : [1199,<?php echo $numl1?>],
                    itemsDesktopSmall         : [979,<?php echo $numl2?>],
                    itemsTablet             : [768,1],
                     <?php } else { ?>
                     itemsDesktop : false,
                     itemsDesktopSmall: false,
                     itemsTablet :false,
                     itemsMobile: false,
                    <?php ?>
                     <?php if ($this->config->get('slider_pauseTime') != '') { ?>
                     autoPlay: <?php echo $this->config->get('slider_pauseTime'); ?>,
                         <?php } else {?>
                     autoPlay: 8000,   
                         <?php ?>
          });
    //--></script>

    <?php $numTab++; ?>
    <?php 
    ?>
    <script type="text/javascript"><!--
          $('#univer_tabs<?php echo $module?> a').tabs();
    //--></script>

    <?php ?>
    <?php
    require 'catalog/view/theme/univer/template/module/singleclick.tpl';
    ?>
     
    Lasted edited by : 7 фев 2016
  14. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    В контроллере вот это:
    PHP:
    foreach ($results_img as $result_img) {
                    if (
    $result_img['image']) {
                    
    $image_dop $this->model_tool_image->resize($result_img['image'], $setting['image_width'], $setting['image_height']);
                    } else {
                    
    $image_dop $this->model_tool_image->resize('no_image.jpg',  $setting['image_width'], $setting['image_height']);
                    }
                     
    $dop_img[] = $image_dop;
                    }
    Замените на это:
    PHP:
    $no_image = array(
       
    $this->model_tool_image->resize('no_image.jpg',  3030),
       
    $this->model_tool_image->resize('no_image.jpg',  $setting['image_width'], $setting['image_height'])
    );
    foreach (
    $results_img as $result_img) {
      if (
    $result_img['image']) {
         
    $dop_img[] = array(
           
    $this->model_tool_image->resize($result_img['image'],  3030),
           
    $this->model_tool_image->resize($result_img['image'],  $setting['image_width'], $setting['image_height'])
         );
      } else {
          
    $dop_img[] = $no_image;
      }
    }
    А в шаблоне вместо этого:
    PHP:
    <?php for ($key 0$key 3$key++) { ?>

      <?php if  (!empty($product['dop_img'][$key])) { ?>
      <div data-index="<?php echo $i?>">
      <a title="<?php echo $product['name']; ?>" data-image="<?php echo $product['dop_img'][$key]; ?>">
      <img src="<?php echo $product['dop_img'][$key];?>" alt="<?php echo $product['name']; ?>" ></a>
      </div>
      <?php ?>

    <?php  $i++; } ?>
    Впишите это:
    PHP:
    <?php $dop_images array_slice($product['dop_img'], 03);
       foreach (
    $dop_images as $dop_img) { ?>
          <?php if  (!empty($dop_img)) { ?>
            <div data-index="<?php echo $i?>">
                <a title="<?php echo $product['name']; ?>" data-image="<?php echo $dop_img[1]; ?>">
                <img src="<?php echo $dop_img[0]; ?>" alt="<?php echo $product['name']; ?>" ></a>
            </div>
          <?php ?>
    <?php  $i
    ++; } ?>
     
    opalko нравится это.
  15. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Dotrox, Вы гений, всё работает. Не много есть людей, которые действительно могут и хотят помочь. Я преклоняюсь перед Вами. Благодаря Вам и Вашей поддержке http://wmasteru.org уникален
     
    skiv14 нравится это.
  16. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Код прекрасно работает на главной странице, но не работает на других, например странице категорий и производителей. Пытался сам разобраться, но безуспешно, может подскажете в чём проблема?
     
  17. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    Не работает в модуле или для товаров самих этих страниц? Если второе, то всё предсказуемо: там надо подправить код для контроллеров и, возможно, в шаблонах тоже.
     
    opalko нравится это.
  18. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    Не работает для товаров на этих страницах. А код нужно подправить в контроллерах страниц или модуля, и было бы хорошо знать что именно править?
     
  19. Dotrox

    Dotrox Команда форума

    Регистрация:
    27 ноя 2012
    Сообщения:
    3.198
    Симпатии:
    1.306
    В контроллерах страниц, модуль там ни при чём.
    Делайте по аналогии с модулем. Посмотрите, как выводятся изображения в модуле и делайте подобным образом, но с учётом переменных конкретного контроллера.
     
    Pant и opalko нравится это.
  20. opalko

    opalko

    Регистрация:
    23 дек 2014
    Сообщения:
    204
    Симпатии:
    14
    В контроллерах есть два похожих кода, но не знаю с каким из них работать, т.к. фото на выходе 30x30px. Первый код
    PHP:
    foreach ($results as $result) {
                    if (
    $result['image']) {
                        
    $image $this->model_tool_image->resize($result['image'], $this->config->get('config_image_product_width'), $this->config->get('config_image_product_height'));
                        
    $imagewidth $this->config->get('config_image_product_width');
                        
    $imageheight $this->config->get('config_image_product_height');
                    } else {
                        
    $image false;
                        
    $imagewidth '';
                        
    $imageheight '';
                    }
    и второй
    PHP:
    foreach ($productbenefits as $benefit) {
                        if (
    $benefit['image'] && file_exists(DIR_IMAGE $benefit['image'])) {
                            
    $bimage $benefit['image'];
                            if (
    $benefit['type']) {
                                
    $bimage $this->model_tool_image->resize($bimage2525);
                            } else {
                                
    $bimage $this->model_tool_image->resize($bimage12060);
                            }
                        } else {
                            
    $bimage 'no_image.jpg';
                        }
     
    Lasted edited by : 16 фев 2017