ECCUBE2.x(2.12.0~2.13.1)で「のし対応」プラグインが他のプラグインに干渉してしまう

ECCUBE2.x(2.12.0~2.13.1)で「のし対応」プラグインが他のプラグインに干渉してしまうのラグインに干渉してしまうeccube

ECCUBE2での人気プラグインに「のし対応」プラグインhttp://www.ec-cube.net/products/detail.php?product_id=278)がありますが、商品購入の際のテンプレートを結構な感じで書き換えてしまうため他のプラグインが動かなくなったりします。
あとスマホ用のテンプレートもうまく動かなり、結局以下のような感じで対応しました。

  1. インストール済みの「のし対応プラグイン」のファイルをバックアップ:同プラグインを入れると以下のようにディレクトリ出来ます。
    dataフォルダ/downloads/plugin/GiftPaper

    ECCUBEの「data」フォルダ(※インストールのやり方でディレクトリ名やサーバー上のパスが変わります)以下にある「downloads」ディレクトリの中にプラグイン用のサブディレクトリが出来ており、今回は「のし対応プラグイン」の「GiftPaper」ディレクトリをFTPなどでローカルに落とします。

  2. GiftPaper.phpを書き換える:同プラグインの本体は「GiftPaper」ディレクトリ内の「GiftPaper.php」になります。
    こちらの414行あたりから

    function prefilterTransform(&$source, LC_Page_Ex $objPage, $filename) {
      $objTransform = new SC_Helper_Transform($source);
                                   以後省略

    の様にECCUBEデフォルトのテンプレートを書き換える処理が入ります。
    今回はスマホの表示がおかしい(のしの選択肢が出ない、選んでも確認画面に進めないなど)がありましたので、スマホのテンプレを書き換えている部分を修正しました。
    (ECCUBEでプラグインからデフォルトのテンプレを書き換える際には「SC_Helper_Transform(トランスフォーム)」)という機能を使って処理を行います。
    基本的にはJQueryで要素を書き換えたり追加する処理と同じです。詳細に関してはプラグイン作成のリファレンス(http://downloads.ec-cube.net/src/manual/12.0_plugin/plugin.pdf)の11ページあたりを参照してください。)
    以下のソースでは「//リプレイスでの対応」とあるようにテンプレートのある部分を「replaceElement」を使ってごっそり置き換える処理を行っています。(461行目)

     // 458行目辺り。お支払方法・お届け時間等の指定画面
     if(strpos($filename, "shopping/payment.tpl") !== false) {
     //リプレイスでの対応
     $objTransform->select('section#undercolumn')->replaceElement(file_get_contents($template_dir . 'shopping/plg_GiftPaper_payment_section_replace.tpl'));
     //$objTransform->select("section#undercolumn section.point_area", 0)->insertAfter(file_get_contents($template_dir . "shopping/plg_GiftPaper_payment_section.tpl"));
     }

    この「replaceElement」で置き換えているのが「GiftPaper」ディレクトリ内の「shopping/plg_GiftPaper_payment_section_replace.tpl」ファイルになりますが、他のプラグインが書き換えようとする際に必要な要素やセレクタ(idやclass)が含まれておらずテンプレートが書き換えられない為干渉が起こってしまう模様。
    なのでその下にコメントアウトしてある用意してある462行目

    $objTransform->select("section#undercolumn section.point_area", 0)->insertAfter(file_get_contents($template_dir . "shopping/plg_GiftPaper_payment_section.tpl"));

    のほうをコメントを取ってアクティブにします。(逆に461行目の部分はコメントアウトするか消します。)
    この部分ではデフォルトのテンプレートの「section#undercolumnのsection.point_area」の後に「GiftPaper」ディレクトリ内の「shopping/plg_GiftPaper_payment_section.tpl」を挿入するという処理ですので他のプラグインで干渉する心配がなくなります。

    うまく動かない場合はsection#undercolumn section.point_area のセレクタの部分が適切かどうか見直し、「GiftPaper」ディレクトリ内の「shopping/plg_GiftPaper_payment_section.tpl」も見直してもらうと大丈夫かと思います。

コメント

':'',ie6_fallback:!0,changepicturecallback:function(){if(viewDisabled){viewDisabled=!1;return}lastImage=$('#pp_full_res').find('img').attr('src');rl_view_image(script,lastImage);if(args.allowExpand){$('a.pp_expand').on('click',function(){viewDisabled=!0})}},callback:function(){rl_hide_image(script,lastImage)}});break;case 'fancybox':var lastImage='';$('a[rel*="'+selector+'"], a[data-rel*="'+selector+'"]').fancybox({modal:args.modal,overlayShow:args.showOverlay,showCloseButton:args.showCloseButton,enableEscapeButton:args.enableEscapeButton,hideOnOverlayClick:args.hideOnOverlayClick,hideOnContentClick:args.hideOnContentClick,cyclic:args.cyclic,showNavArrows:args.showNavArrows,autoScale:args.autoScale,scrolling:args.scrolling,centerOnScroll:args.centerOnScroll,opacity:args.opacity,overlayOpacity:parseFloat(args.overlayOpacity/100),overlayColor:args.overlayColor,titleShow:args.titleShow,titlePosition:args.titlePosition,transitionIn:args.transitions,transitionOut:args.transitions,easingIn:args.easings,easingOut:args.easings,speedIn:parseInt(args.speeds),speedOut:parseInt(args.speeds),changeSpeed:parseInt(args.changeSpeed),changeFade:parseInt(args.changeFade),padding:parseInt(args.padding),margin:parseInt(args.margin),width:parseInt(args.videoWidth),height:parseInt(args.videoHeight),onComplete:function(){lastImage=$('#fancybox-content').find('img').attr('src');rl_view_image(script,lastImage)},onClosed:function(){rl_hide_image(script,lastImage)}});break;case 'nivo':$.each($('a[rel*="'+selector+'"], a[data-rel*="'+selector+'"]'),function(){var attr=$(this).attr('data-rel');if(typeof attr==='undefined'||attr==!1){attr=$(this).attr('rel')}if(typeof attr!=='undefined'&&attr!==!1){var match=attr.match(new RegExp(selector+'\\-(gallery\\-(?:[\\da-z]{1,4}))','ig'));if(match!==null)$(this).attr('data-lightbox-gallery',match[0])}});var observerInitialized=!1;var changeAllowed=!0;var lastImage='';$('a[rel*="'+selector+'"], a[data-rel*="'+selector+'"]').nivoLightbox({effect:args.effect,clickOverlayToClose:args.clickOverlayToClose,keyboardNav:args.keyboardNav,errorMessage:args.errorMessage,afterShowLightbox:function(lightbox){var content=$(lightbox)[0].find('.nivo-lightbox-content');if(!observerInitialized){observerInitialized=!0;observeContentChanges(document.getElementsByClassName('nivo-lightbox-content')[0],!0,function(){if(changeAllowed){lastImage=content.find('.nivo-lightbox-image img').attr('src');rl_view_image(script,lastImage);changeAllowed=!1}})}},afterHideLightbox:function(){changeAllowed=!0;rl_hide_image(script,lastImage)},onPrev:function(element){changeAllowed=!1;lastImage=element[0].attr('href');rl_view_image(script,lastImage)},onNext:function(element){changeAllowed=!1;lastImage=element[0].attr('href');rl_view_image(script,lastImage)}});break;case 'imagelightbox':var selectors=[];var lastImage='';$('a[rel*="'+selector+'"], a[data-rel*="'+selector+'"]').each(function(i,item){var attr=$(item).attr('data-rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr);else{attr=$(item).attr('rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr)}});if(selectors.length>0){selectors=_.uniq(selectors);$(selectors).each(function(i,item){if(typeof event.pagination_type!=='undefined'){$('a[data-rel="'+item+'"], a[rel="'+item+'"]').each(function(){$(this).off('click.imageLightbox')})}$('a[data-rel="'+item+'"], a[rel="'+item+'"]').imageLightbox({animationSpeed:parseInt(args.animationSpeed),preloadNext:args.preloadNext,enableKeyboard:args.enableKeyboard,quitOnEnd:args.quitOnEnd,quitOnImgClick:args.quitOnImageClick,quitOnDocClick:args.quitOnDocumentClick,onLoadEnd:function(){lastImage=$('#imagelightbox').attr('src');rl_view_image(script,lastImage)},onEnd:function(){rl_hide_image(script,lastImage)}})})}break;case 'tosrus':var selectors=[];var lastImage='';$('a[rel*="'+selector+'"], a[data-rel*="'+selector+'"]').each(function(i,item){var attr=$(item).attr('data-rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr);else{attr=$(item).attr('rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr)}});if(selectors.length>0){selectors=_.uniq(selectors);$(selectors).each(function(i,item){if(typeof event.pagination_type!=='undefined'){$('body').find('.tosrus-'+item).remove();$('a[data-rel="'+item+'"], a[rel="'+item+'"]').each(function(){$(this).off('click.tos')})}var tos=$('a[data-rel="'+item+'"], a[rel="'+item+'"]').tosrus({infinite:args.infinite,autoplay:{play:args.autoplay,pauseOnHover:args.pauseOnHover,timeout:args.timeout},effect:args.effect,keys:{prev:args.keys,next:args.keys,close:args.keys},pagination:{add:args.pagination,type:args.paginationType},show:!1,buttons:!0,caption:{add:!0,attributes:["title"]},wrapper:{classes:'tosrus-'+item,onClick:args.closeOnClick?'close':'toggleUI'}});tos.on('sliding.tos',function(event,number){lastImage=$($(event.target).find('.tos-slider .tos-slide')[number]).find('img').attr('src');rl_view_image(script,lastImage)});tos.on('closing.tos',function(){rl_hide_image(script,lastImage)})})}break;case 'featherlight':var selectors=[];var lastImage='';$('a[rel*="'+selector+'"], a[data-rel*="'+selector+'"]').each(function(i,item){var attr=$(item).attr('data-rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr);else{attr=$(item).attr('rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr)}});if(selectors.length>0){selectors=_.uniq(selectors);$.extend($.featherlight.defaults,{openSpeed:parseInt(args.openSpeed),closeSpeed:parseInt(args.closeSpeed),closeOnClick:args.closeOnClick,closeOnEsc:args.closeOnEsc,afterOpen:function(event){lastImage=event.currentTarget.href;rl_view_image(script,lastImage)},afterClose:function(){rl_hide_image(script,lastImage)}});$(selectors).each(function(i,item){if(typeof event.pagination_type!=='undefined'){$('a[data-rel="'+item+'"], a[rel="'+item+'"]').each(function(){$(this).off('click.featherlight')})}if(/-gallery-/.test(item)){$('a[data-rel="'+item+'"], a[rel="'+item+'"]').featherlightGallery({galleryFadeIn:parseInt(args.galleryFadeIn),galleryFadeOut:parseInt(args.galleryFadeOut),previousIcon:'❮',nextIcon:'❯'})}else if(/-video-/.test(item)){$('a[data-rel="'+item+'"], a[rel="'+item+'"]').featherlight()}else{$('a[data-rel="'+item+'"], a[rel="'+item+'"]').featherlight()}})}break;case 'magnific':var selectors=[];var lastImage='';$('a[rel*="'+selector+'"], a[data-rel*="'+selector+'"]').each(function(i,item){var attr=$(item).attr('data-rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr);else{attr=$(item).attr('rel');if(typeof attr!=='undefined'&&attr!==!1&&attr!=='norl')selectors.push(attr)}});if(selectors.length>0){selectors=_.uniq(selectors);$(selectors).each(function(i,item){var subselector=$('a[data-rel="'+item+'"], a[rel="'+item+'"]');var element=$(subselector[0]);var media_type=element.data('magnific_type');var content_type=element.data('rl_content');if(typeof content_type!=='undefined')media_type=content_type;if(typeof media_type==='undefined')media_type='image';var fixedContentPos='auto';var fixedBgPos='auto';if(args.fixedContentPos==='true')fixedContentPos=!0;else if(args.fixedContentPos==='false')fixedContentPos=!1;if(args.fixedBgPos==='true')fixedBgPos=!0;else if(args.fixedBgPos==='false')fixedBgPos=!1;subselector.magnificPopup({type:media_type==='gallery'?'image':(media_type==='video'?'iframe':media_type),disableOn:args.disableOn,midClick:args.midClick,preloader:args.preloader,closeOnContentClick:args.closeOnContentClick,closeOnBgClick:args.closeOnBgClick,closeBtnInside:args.closeBtnInside,showCloseBtn:args.showCloseBtn,enableEscapeKey:args.enableEscapeKey,alignTop:args.alignTop,autoFocusLast:args.autoFocusLast,fixedContentPos:fixedContentPos,fixedBgPos:fixedBgPos,image:{titleSrc:function(item){var title=item.el.data('rl_title');var caption=item.el.data('rl_caption');if(!title)title='';if(!caption)caption='';return title+''+caption+''}},gallery:{enabled:subselector.length>1&&media_type==='gallery',navigateByImgClick:!0,preload:[0,1]},callbacks:{close:function(){rl_hide_image(script,this.currItem.src)},imageLoadComplete:function(){rl_view_image(script,this.currItem.src)}}})})}break}}})(jQuery);
タイトルとURLをコピーしました