Nikoya

Ok i’ll try.

to be honnest i don’t remeneber to already have never pushed anything on Git so ..

i’ll try ^^

sorry for bbcode ??

this is picture in wp-admin :

(new column ‘clear left’)

https://imageshack.us/photo/my-images/266/ayz2.jpg/

I can’t wait … ??

So i’ve done that and that work !

I’ve use #2 (my way) :

There is 3 files to modify :

– wpcolumns/wpcolumns_plugin.js
– wpcolumns/plugin_shortcode.php
– styles/bootstrap_admin.min.css

This is the code :

Edit wpcolumns/wpcolumns_plugin.js
Line 150 add

clearleft='<input type="checkbox"  name="'+index+'clear['+i+']" id="'+index+'clear'+i+'" value="yes">';

Line 155 replace
ele+='<td><div class="head_division">'+sm+'</div><div class="head_division">'+smoff+'</div><div class="head_division head_division_check right">'+hidecol+'</div></td>';

by

ele+='<td><div class="head_division head_division_check">'+clearleft+'</div><div class="head_division">'+sm+'</div><div class="head_division">'+smoff+'</div><div class="head_division head_division_check right">'+hidecol+'</div></td>';

Line 267 replace :
//var a_md=[],a_sm=[],a_xs=[],a_lg=[],j=0,a_md_off=[],a_sm_off=[],a_xs_off=[],a_lg_off=[],a_md_hide=[],a_sm_hide=[],a_xs_hide=[],a_lg_hide=[],sm='',md='',xs='',smoff='',mdoff='',xsoff='',lgoff='',smhide='',mdhide='',xshide='',lghide='';

BY

var a_md=[],a_sm=[],a_xs=[],a_lg=[],j=0,a_md_off=[],a_sm_off=[],a_xs_off=[],a_lg_off=[],a_md_hide=[],a_sm_hide=[],a_xs_hide=[],a_lg_hide=[],sm='',md='',xs='',smoff='',mdoff='',xsoff='',lgoff='',smhide='',mdhide='',xshide='',lghide='',smclear='',mdclear='',xsclear='',lgclear='';

Line 355 ADD

if(jQuery('#mdclear'+i).is(':checked')){
                mdclear=' mdclear="yes"';
            }
            else{
                mdclear='';
            }
            if(jQuery('#smclear'+i).is(':checked')){
                smclear=' smclear="yes"';
            }
            else{
                smclear='';
            }
            if(jQuery('#xsclear'+i).is(':checked')){
                xsclear=' xsclear="yes"';
            }
            else{
                xsclear='';
            }
            if(jQuery('#lgclear'+i).is(':checked')){
                lgclear=' lgclear="yes"';
            }
            else{
                lgclear='';
            }

Line 382 Replace

shortcode += '<br/>[column lg="'+a_lg[i]+'"'+md+sm+xs+mdoff+smoff+xsoff+lgoff+mdhide+smhide+xshide+lghide+' ]<br/>text<br/>[/column]';

BY

shortcode += '<br/>[column lg="'+a_lg[i]+'"'+md+sm+xs+mdoff+smoff+xsoff+lgoff+mdhide+smhide+xshide+lghide+mdclear+smclear+xsclear+lgclear+' ]<br/>text<br/>[/column]';

File plugin_shortcode.php

Line 27 Add this in the array

'mdclear' => '',
        'smclear' => '',
        'xsclear' => '',
        'lgclear' => '',

Line 74 add

$arr2 = array('mdclear', 'smclear', 'xsclear', 'lgclear');
    foreach ($arr2 as $k => $aa) {
        $nn = str_replace('clear', '', $aa);
        if (${$aa} == 'yes') {
            $classes[] = 'clear-' . $nn;
        }
    }

Edit file bootstrap_admin.min.css

Replace .head_division{float:left;font-size:10px;text-align:left;width:42%}.head_division.right{text-align:right}.head_division_check{width:10%}

BY

.head_division{float:left;font-size:10px;text-align:left;width:30%}.head_division.right{text-align:right}.head_division_check{width:20%}

Finally just add ccs in your theme/styles.css

/* Small devices (tablets, 768px and up) */
@media (max-width: 767px){
    .clear-xs{clear:left;}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
    .clear-sm{clear:left;}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px){
    .clear-md{clear:left;}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200) {
    .clear-lg{clear:left;}
}

Easy to do, easy to maintain, easy to use

Thx

hi,

ok i understand.

Thx for your great work ??

thx

Already update ! ??

you are so fast.

glad to have helped.

Hello

The issue #1 is still here.

Adding this line 110 just before “do_shortcode($content);” seems to correct this issue :

$text = addslashes($text);

If it’s correct, maybe you can add this to an update ? please ^^

Thx

Thank you ??

Good news ??

Thx

Hi,

#2 Seems to be ok.

Good Job !!!

Thanks

Oups little mistake : the second CSS Must be :

col-lg-12, col-md-12, col-sm-12, col-xs-12{float:left;}

Thx again ??

Hello

This is my page :

First test is More1, then second text is More2

[restabs text="More1"]
[restab title="Tab number 1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N" active="active"]Tab 1 content goes here.[/restab]
[restab title="Tab number 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N"]Tab 2 content goes here.[/restab]
[restab title="Tab number 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N"]Tab 3 content goes here.[/restab]
[restab title="Tab number 4 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N"]Tab 4 content goes here.[/restab][/restabs]

[restabs text="More2"]
[restab title="Tab number 1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N" active="active"]Tab 1 content goes here.[/restab]
[restab title="Tab number 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N"]Tab 2 content goes here.[/restab]
[restab title="Tab number 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N"]Tab 3 content goes here.[/restab]
[restab title="Tab number 4 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N"]Tab 4 content goes here.[/restab][/restabs]

This the the generated Html / JS code :

<article class="content content-main">
      <div class="tabbable  ">
            <ul class="nav osc-res-nav nav-tabs" id="oscitas-restabs-0">
                  <li class="dropdown pull-right tabdrop">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">More1 <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                              <li class="">
                                    <a href="#ert-pane-0-2" data-toggle="tab">Tab number 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                              </li>
                              <li class="">
                                    <a href="#ert-pane-0-3" data-toggle="tab">Tab number 4 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                              </li>
                        </ul>
                  </li>
                  <li class="active">
                        <a href="#ert-pane-0-0" data-toggle="tab">Tab number 1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                  </li>
                  <li class="">
                        <a href="#ert-pane-0-1" data-toggle="tab">Tab number 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                  </li>
            </ul>
            <div class="tab-content">
                  <div class="tab-pane active" id="ert-pane-0-0">Tab 1 content goes here.</div>
                  <div class="tab-pane " id="ert-pane-0-1">Tab 2 content goes here.</div>
                  <div class="tab-pane " id="ert-pane-0-2">Tab 3 content goes here.</div>
                  <div class="tab-pane " id="ert-pane-0-3">Tab 4 content goes here.</div>
            </div>
      </div>
      <script>
        jQuery(document).ready(function() {
            jQuery('.osc-res-nav').tabdrop({
            'text': 'More1'
            });
        });
    </script>
<p>&nbsp;</p>
      <div class="tabbable  ">
            <ul class="nav osc-res-nav nav-tabs" id="oscitas-restabs-1">
                  <li class="dropdown pull-right tabdrop">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">More1 <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                              <li class="">
                                    <a href="#ert-pane-1-2" data-toggle="tab">Tab number 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                              </li>
                              <li class="">
                                    <a href="#ert-pane-1-3" data-toggle="tab">Tab number 4 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                              </li>
                        </ul>
                  </li>
                  <li class="active">
                        <a href="#ert-pane-1-0" data-toggle="tab">Tab number 1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                  </li>
                  <li class="">
                        <a href="#ert-pane-1-1" data-toggle="tab">Tab number 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. N</a>
                  </li>
            </ul>
            <div class="tab-content">
                  <div class="tab-pane active" id="ert-pane-1-0">Tab 1 content goes here.</div>
                  <div class="tab-pane " id="ert-pane-1-1">Tab 2 content goes here.</div>
                  <div class="tab-pane " id="ert-pane-1-2">Tab 3 content goes here.</div>
                  <div class="tab-pane " id="ert-pane-1-3">Tab 4 content goes here.</div>
            </div>
      </div>

<script>
        jQuery(document).ready(function() {
            jQuery('.osc-res-nav').tabdrop({
            'text': 'More2'
            });
        });
    </script>
    </article>

As you can see there is only Text1 in html code.

Thx

#2 4 different tabs in column from your other plugin “easy bootstrap shortcode”