[George Socha]

Steve,

I would like to be able to expand and collapse blocks of information that show up in the single-entry view of cMap. For example, on this page, http://www.edrm.net/apersee/name/advanced-discovery, I list 16 offices, which takes up too much space. (Using columns might help as well; I have not tried to do that.)

Any suggestions for how I might accomplish this?

Thanks,

George

[Steven Zahm]

@ George

Sorry, I really do not have any suggestions other than columns like you’re thinking.

[George Socha]

Okay. Thanks.

[George Socha]

Steve,

I have columns working but there is a refinement I have not figure out how to accomplish. If I enter just one address, it spans several columns (I am using 4 columns) instead of showing up all in a single column. Here is an example: http://www.edrm.net/apersee/name/falcon-discovery

When I enter multiple addresses, the individual addresses do not necessarily stay together. Instead, one address might begin at the end of one column and end at the beginning of a second column. Here is an example: http://www.edrm.net/apersee/name/advanced-discovery

I would like each address to stay in just one column.

How might I take care of this problem?

Thanks,

George

[Steven Zahm]

@ George

There’s no way to deal with that in pure CSS that I am aware of. About a year ago or so I did some custom work where columns were needed and had issue with headers at the ends of columns. I ended up using the jQuery plugin to do it.

https://github.com/adamwulf/Columnizer-jQuery-Plugin

If you can add the dontsplit class to the span classedasadr` that should make it so addresses are not split when the jQuery plugin creates the columns.

Hope that helps.

[George Socha]

Steve,

Using CSS and HTML to set up tabs, I have been able to able to expand and collapse blocks of information that show up in the single-entry view of cMap. Here is an example: http://www.edrm.net/apersee/name/advanced-discovery

I am trying to figure out how to make a tab appear only if there is content. In the example, I want the “Phone” tab to appear as there is a phone number, drawn from the phone_numbers field, that should be displayed. I want the “Email” tab not to appear, as there is not entry in the email field for this entity’s record.

I have tried various permutations of the following but with no success:

if ($atts['show_email'] !== '') {
echo '
';
    echo '<input type="radio" name="tabs" id="tab5">';
    echo '<label for="tab5">Email</label>';
    echo '<div id="tab-content5" class="tab-content animated fadeIn">';     
        if ( $atts['show_email'] ) echo                 
        $entry->getEmailAddressBlock( array( 'format' => $atts['email_format'] , 'type' => $atts['email_types'] ) );
    echo '</div>';
echo '
';
}

I suspect that my problem is with this line and that I should be using something other than show_email:

if ($atts['show_email'] !== '') {

Any suggestions?

Thanks,

George

[Steven Zahm]

@ George

Pretty nice!

You need to add an if statement before you output the tab HTML and its content. Something like this should do it.

if ($atts['show_email'] !== '') {
    if ( $entry->getEmailAddresses() ) {

        echo '';
            echo '<input type="radio" name="tabs" id="tab5">';
            echo '<label for="tab5">Email</label>';
            echo '<div id="tab-content5" class="tab-content animated fadeIn">';     
                if ( $atts['show_email'] ) echo                 
                $entry->getEmailAddressBlock( array( 'format' => $atts['email_format'] , 'type' => $atts['email_types'] ) );
            echo '</div>';
        echo '';
    }
}

[George Socha]

Steve,

That both worked and did not work. It worked for these tabs: Email; and Messages. It did not work for these tabs: Social Media; Addresses; Phone; Dates; and Categories.

Here is the code that is working:

        <?php

            echo '<hr class="thin" />';

        echo '<ul class="tabs">';
            echo '
';
                echo '<input type="radio" name="tabs" id="tab1" checked>';
                echo '<label for="tab1">Links</label>';
                echo '<div id="tab-content1" class="tab-content animated fadeIn">';
                    if ( $atts['show_links'] );             
                        $entry->getLinkBlock( array( 'format' => $atts['link_format'], 'type' => $atts['link_types'] ) );
                echo '</div>';
            echo '
';

            echo '
';
                echo '<input type="radio" name="tabs" id="tab2">';
                echo '<label for="tab2">Social Media</label>';
                echo '<div id="tab-content2" class="tab-content animated fadeIn">';     
                    if ( $atts['show_social_media'] )   
                    $entry->getSocialMediaBlock();
                echo '</div>';
            echo '
';

            echo '
';
                echo '<input type="radio" name="tabs" id="tab3">';
                echo '<label for="tab3">Addresses</label>';
                echo '<div id="tab-content3" class="tab-content animated fadeIn">';     
                    if ( $atts['show_addresses'] ) echo '<div class="four-columns">' ,
                        $entry->getAddressBlock( array( 'format' => $atts['addr_format'] , 'type' => $atts[''] ) ) , '</div>';
                echo '</div>';
            echo '
';

            echo '
';
                echo '<input type="radio" name="tabs" id="tab4">';
                echo '<label for="tab4">Phone</label>';
                echo '<div id="tab-content4" class="tab-content animated fadeIn">';     
                    if ( $atts['show_phone_numbers'] ) echo                 
                        $entry->getPhoneNumberBlock( array( 'format' => $atts['phone_format'] , 'type' => $atts['phone_types'] ) );
                echo '</div>';
            echo '
';

            if ($atts['show_email'] !== '') {
                if ( $entry->getEmailAddresses() ) {

                    echo '
';
                        echo '<input type="radio" name="tabs" id="tab5">';
                        echo '<label for="tab5">Email</label>';
                        echo '<div id="tab-content5" class="tab-content animated fadeIn">';     
                            if ( $atts['show_email'] ) echo                 
                            $entry->getEmailAddressBlock( array( 'format' => $atts['email_format'] , 'type' => $atts['email_types'] ) );
                        echo '</div>';
                    echo '
';
                }
            }

            if ($atts['show_im'] !== '') {
                if ( $entry->getImBlock() ) {

                    echo '
';
                        echo '<input type="radio" name="tabs" id="tab6">';
                        echo '<label for="tab6">Messenger</label>';
                        echo '<div id="tab-content6" class="tab-content animated fadeIn">';     
                            if ( $atts['show_im'] ) echo $entry->getImBlock();
                        echo '</div>';
                    echo '
';
                }
            }

            echo '
';
                echo '<input type="radio" name="tabs" id="tab7">';
                echo '<label for="tab7">Dates</label>';
                echo '<div id="tab-content7" class="tab-content animated fadeIn">';     
                    if ( $atts['show_dates'] ) echo             
                        $entry->getDateBlock( array( 'format' => $atts['date_format'], 'type' => $atts['date_types'] ) );
                    echo '</div>';
                echo '
';

            echo '
';
                echo '<input type="radio" name="tabs" id="tab8">';
                echo '<label for="tab8">Categories</label>';
                echo '<div id="tab-content8" class="tab-content animated fadeIn">';     
                    if ( $atts['show_categories'] )
                    echo cn_display_terms_of_parent_term_id( 35, $entry->getCategory() );
                echo '</div>';
            echo '
';

        echo '';

        ?>

I have no idea why some tabs work and others do not.

Thanks,

George

[Steven Zahm]

@ George

Glancing at the code it looks like you only added the additional if statement to the IM and email block and not to the others which would explain why it worked for those and not the others. Does that make sense?

[George Socha]

For each of the others, I tried to add the additional if statement.

Here is the code when I add the if statement for the “Phones” tab:

            if ($atts['show_phone_numbers'] !== '') {
                if ( $entry->getPhoneNumberBlock() ) {

                    echo '
';
                        echo '<input type="radio" name="tabs" id="tab4">';
                        echo '<label for="tab4">Phone</label>';
                        echo '<div id="tab-content4" class="tab-content animated fadeIn">';     
                            if ( $atts['show_phone_numbers'] ) echo                 
                                $entry->getPhoneNumberBlock( array( 'format' => $atts['phone_format'] , 'type' => $atts['phone_types'] ) );
                        echo '</div>';
                    echo '
';
                }
            }

Attached is a screenshot of what happens when I add that if statement.

Thanks,

George

Attachments:

You must be logged in to view attached files.

[Author]

Posts