Pre-Sale Questions

Hi,

1. No, sorry, WP Customer Area doesn’t currently include any paid membership feature. However, some users reported they’ve managed to integrate some membership plugins, but I don’t know which one sorry. Choosing the right one would depend on your needs. Do not hesitate to try one of them with the free version of WP Customer Area and report any issue on our main support forums and we’ll try to help.
2. The my-account page is easily editable or even extendable with ACF and one of our add-ons. For more information about this question, please ask directly on our main support forums because we’re not allowed to link or talk about premium features on WP.org
3. No, the payment part would depend on the membership plugin you chose.
4. Sure, any part of the area is editable by editing our templates. Please check on our main site > documentations > template system.

Best regards.

Hi,

WP Customer Area already includes profiles and login pages but it’s up to you to use another solution if you’d like to.

I would recommend in that case to set the WPCA profiles pages as private. It’s better than removing them, to avoid unexpected behaviors. You can also remove those pages from the auto-generated WP Customer Area menu in appearrence > Menus (duplicating first is recommended). Or, you can also completely disable this menu in Settings > Frontend > Menu, and manually create your own. However, if you manually create items pointing to some pages handled by WPCA permissions, you’ll need to take care about that by yourself (WPCA automatically hide items for users without capabilities to access those sections).

About the line format, I plan to add a new collection view, but I have no ETA for now. However, if you really need this right now, I can give you there some parts of code that will point you to the right direction to perform that (this actually requires a bit coding knowledges).

First, check our templates system documentation, and our code snippets documentation to know how to create a custom plugin for WPCA. This is where you’ll need to add custom code.

Find below some code to add in your custom plugin.

A. Removing collection views

Add this in your custom plugin.

/**
 * Change default collection views to list
 *
 * @param $data
 *
 * @return mixed
 */
function cuarrc_change_default_collection_views($data)
{
    $data['default_collection_view'] = [];
    $private_types = cuar()->get_private_post_types();
    foreach ($private_types as $type) {
        $data['default_collection_view'][$type] = 'list';
    }

    return $data;
}

add_filter('cuar/core/js-messages?zone=frontend', 'cuarrc_change_default_collection_views', 100, 1);

/**
 * Load Custom frontend scripts
 */
function custom_cuar_load_scripts()
{
    wp_register_script('cuarrc-custom-scripts',
        plugins_url(__DIR__). 'script.js',
        'cuar.frontend',
        '1.0.1',
        true);
    wp_enqueue_script('cuarrc-custom-scripts');
}

add_action('wp_enqueue_scripts', 'custom_cuar_load_scripts');

In your custom templates directory, create the file collections-button-group.template.php and add this into it

<?php
/** Template version: 3.0.1
 *
 * -= 3.0.1 =-
 * - Removing view buttons
 *
 * -= 3.0.0 =-
 * - Initial version
 *
 */
defined('ABSPATH') or die('Nope, not accessing this');

In the root folder of the plugin, create a file named script.js and paste this into it

/**
 * Force Cookies to be stored as lIst view only
 */
(function ($)
{

    // Variables
    // -
    var wrapperJS = '#cuar-js-content-container',
            $wrapperJS = $(wrapperJS),
            $collectionContainer = $('#cuar-js-collection-gallery', $wrapperJS);

    if ($collectionContainer.length > 0) {
        if (typeof Cookies === 'undefined') {
            console.log('[ WPCA - Warning ] jquery.Cookie.min.js missing');
        }

        // Force cookie session to list view
        var cookieName = $collectionContainer.data('type') + '-collection-layout';
        var cookieLayout = (typeof Cookies !== 'undefined') ? Cookies.get(cookieName) : '';
        if (cookieLayout !== 'list') {
            Cookies.set(cookieName, 'list');
            $collectionContainer.addClass(cookieLayout).removeClass('grid');
        }
    }
})(jQuery);

B. Customizing the single views for private files

Create a file named customer-private-files-content-item.template.php and add this into it

<?php
/** Template version: 3.3.2
 *
 * -= 3.3.2 =-
 * - Add Inline dates
 *
 * -= 3.3.1 =-
 * - Simplified views
 *
 * -= 3.3.0 =-
 * - Replace clearfix CSS classes with cuar-clearfix
 *
 * -= 3.2.0 =-
 * - Improve longs owner names rendering
 *
 * -= 3.1.0 =-
 * - Improve thumbnails ratios
 *
 * -= 3.0.0 =-
 * - Improve UI for new master-skin
 *
 * -= 1.2.0 =-
 * - Compatibility with the new multiple attached files
 *
 * -= 1.1.0 =-
 * - Updated markup
 * - Normalized the extra class filter name
 *
 * -= 1.0.0 =-
 * - Initial version
 *
 */
defined('ABSPATH') or die('Nope, not accessing this');
?>

<?php
global $post;

$attachments = cuar_get_the_attached_files($post->ID);

$extra_class = ' ' . get_post_type();
$extra_class = apply_filters('cuar/templates/list-item/extra-class?post-type=' . get_post_type(), $extra_class, $post);
?>

<div class="collection-item of-h mix mbn br-l br-r col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12<?php
echo $extra_class; ?>">

    <div class="cuarrc-inline-cell cuar-title h4 p10 br-b mn">
        <span class="panel-title pln">
            <a href="<?php the_permalink(); ?>" style="font-weight: normal;"><?php the_title(); ?></a>
        </span>
    </div>
    <div class="cuarrc-inline-cell p10 br-b mn text-right" style="margin-top: -6px;
    white-space: nowrap;">
        <?php do_action('cuar/templates/collection/item/badges'); ?>
    </div>
	<div class="cuarrc-inline-cell p10 br-b mn hidden-xs" style="white-space: nowrap;">
        <span class="panel-title pln">
            <?php echo get_the_time(get_option('date_format')) . ' ' . get_the_time(get_option('time_format')); ?>
        </span>
	</div>
    <div class="cuarrc-inline-cell p10 br-b mn hidden-xs" style="white-space: nowrap;">
        <div class="collection-footer-meta-author" data-toggle="tooltip" data-placement="left"
             data-original-title="<?php printf(esc_attr__('Created by %s', 'cuarrc'), get_the_author_meta('display_name')
             ); ?>">
            <div class="cuarrc-inline-cell-icon hidden-xs pln va-m hidden-sm"><i class="fa fa-user"></i>&nbsp;<?php echo
                get_the_author_meta('display_name'); ?></div>
            <div class="cuarrc-inline-cell-icon hidden-xs pln va-m hidden-md hidden-lg hidden-xl"><i class="fa
            fa-user"></i>&nbsp;</div>
        </div>
    </div>
    <div class="cuarrc-inline-cell p10 br-b mn hidden-xs">
        <div class="collection-footer-meta-owner" data-toggle="tooltip" data-placement="left"
             data-original-title="<?php printf(esc_attr__('Assigned to %s', 'cuarrc'), cuar_get_the_owner()); ?>">
            <div class="cuarrc-inline-cell-icon hidden-xs pln va-m hidden-sm"><i class="fa fa-group"></i>&nbsp;<?php echo cuar_get_the_owner(); ?></div>
            <div class="cuarrc-inline-cell-icon hidden-xs pln va-m hidden-md hidden-lg hidden-xl"><i class="fa fa-group"></i>&nbsp;</div>
        </div>
    </div>
    <div class="cuarrc-inline-cell p10 br-b mn text-right" style="margin-top: -6px;
    white-space: nowrap;">
        <?php foreach ($attachments as $file_id => $file) : ?>
            <a href="<?php cuar_the_attached_file_link($post->ID, $file); ?>"
               title="<?php esc_attr_e('Get file', 'cuarrc'); ?>" class="btn btn-default btn-xs"
               style="margin-left:5px;">
                <span class="fa fa-download"></span>
            </a>
        <?php endforeach; ?>
    </div>
</div>

C. Customizing the dashboard views for private files

Create a file named customer-private-files-content-item-dashboard.template.php and add this into it

<?php
/** Template version: 3.3.2
 *
 * -= 3.3.2 =-
 * - Add Inline dates
 *
 * -= 3.1.1 =-
 * - Simplified views
 *
 * -= 3.1.0 =-
 * - Add hooks
 *
 * -= 3.0.0 =-
 * - Improve UI for new master-skin
 *
 * -= 1.2.0 =-
 * - Compatibility with the new multiple attached files
 *
 * -= 1.1.0 =-
 * - Updated markup
 * - Normalized the extra class filter name
 *
 * -= 1.0.0 =-
 * - Initial version
 *
 */
defined('ABSPATH') or die('Nope, not accessing this');
?>

<?php
global $post;
$attachments = cuar_get_the_attached_files($post->ID);

$title_popup = sprintf(__('Uploaded on %s', 'cuarrc'), get_the_date());
$file_count = cuar_get_the_attached_file_count($post->ID);
?>

<tr>
    <td class="cuar-title" style="width: 100%;">
        <a href="<?php the_permalink(); ?>" title="<?php echo esc_attr($title_popup); ?>"><?php the_title(); ?></a>
    </td>
    <td class="text-right cuar-extra-info" style="white-space: nowrap;">
        <?php do_action('cuar/templates/collection/item/badges'); ?>
    </td>
	<td class="cuarrc-inline-cell p10 br-b mn hidden-xs" style="white-space: nowrap;">
            <?php echo get_the_time(get_option('date_format')) . ' ' . get_the_time(get_option('time_format')); ?>
	</td>
    <td class="hidden-xs" style="white-space: nowrap;">
        <div class="collection-footer-meta-author" data-toggle="tooltip" data-placement="left"
             data-original-title="<?php printf(esc_attr__('Created by %s', 'cuarrc'), get_the_author_meta('display_name')
             ); ?>">
            <div class="cuarrc-inline-cell-icon pln va-m hidden-sm"><i class="fa fa-user"></i>&nbsp;<?php echo
                get_the_author_meta('display_name'); ?></div>
            <div class="cuarrc-inline-cell-icon pln va-m hidden-md hidden-lg hidden-xl"><i class="fa
            fa-user"></i>&nbsp;</div>
        </div>
    </td>
    <td class="hidden-xs">
        <div class="collection-footer-meta-owner" data-toggle="tooltip" data-placement="left"
             data-original-title="<?php printf(esc_attr__('Assigned to %s', 'cuarrc'), cuar_get_the_owner()); ?>">
            <div class="cuarrc-inline-cell-icon pln va-m hidden-sm"><i class="fa fa-group"></i>&nbsp;<?php echo cuar_get_the_owner(); ?></div>
            <div class="cuarrc-inline-cell-icon pln va-m hidden-md hidden-lg hidden-xl"><i class="fa fa-group"></i>&nbsp;</div>
        </div>
    </td>
    <td class="text-right cuar-extra-info" style="white-space: nowrap;">
        <?php foreach ($attachments as $file_id => $file) : ?>
            <a href="<?php cuar_the_attached_file_link($post->ID, $file); ?>"
               title="<?php esc_attr_e('Get file', 'cuarrc'); ?>" class="btn btn-default btn-xs"
               style="margin-left:5px;">
                <span class="fa fa-download"></span>
            </a>
        <?php endforeach; ?>
    </td>
</tr>

D. Custom styling the views

Add this in your custom plugin

function custom_cuar_load_styles()
{
    if (function_exists('cuar_is_customer_area_page')
        && (cuar_is_customer_area_page(get_queried_object_id())
            || cuar_is_customer_area_private_content(get_the_ID()))) {
        wp_enqueue_style(
            'custom_cuar_style',
            plugins_url(__DIR__). 'style.css'
        );
    }
}

add_action('wp_enqueue_scripts', 'custom_cuar_load_styles');

Create a file named style.css in your root plugin folder and paste this into it

/* Make content items 100% width */
@media (min-width : 1400px) {
    body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .gap, body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .mix {
        float : left;
        width : 100%
    }
}

/* Inlince cells tweaks */
body.customer-area-active .cuar-css-wrapper .collection .collection-content.list {
    display: table;
    width: 100%;
}
body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .collection-item {
    display: table-row!important;
    width: 100%;
}
body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .collection-item .cuarrc-inline-cell {
    display: table-cell;
    border-top: 0 solid!important;
    vertical-align: middle;
}
body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .collection-item .cuarrc-inline-cell.cuar-title {
    white-space: normal;
    width: 100%;
}
body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .collection-item .cuarrc-inline-cell .cuarrc-inline-cell-icon > i,
body.customer-area-active .cuar-css-wrapper .collection-footer-meta-owner .cuarrc-inline-cell-icon > i{
    margin : 3px 0 0 0;
    display: inline-table;
}
body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .collection-item .cuarrc-inline-cell .cuarrc-inline-cell-icon,
body.customer-area-active .cuar-css-wrapper .collection-footer-meta-owner .cuarrc-inline-cell-icon {
    display: inline-flex;
}
body.customer-area-active .cuar-css-wrapper .collection .collection-content.list .collection-item:nth-child(2) .cuarrc-inline-cell {
    border-top-width: 1px!important;
    border-top-style: solid!important;
    border-top-color: #d6d6d6!important;
}

E. Extending to other Post Types

This example will actually change the views for private files only. If you also want this for private pages, conversations, tasks, etc… You’ll basically need to use the added class named cuarrc-inline-cell (you’ll probably need to compare this version with the actual one from the plugin).
I know this process can look tricky, but this is the way to go until we add a new collection view with the possibility to choose which views’ styles to display, which is actually not planned.
Do not hesitate to try and ask if you require more assistance.

Best regards.

• This reply was modified 1 year, 2 months ago by Thomas.

Hi,

That’s okay. I normally don’t post such complicated examples but I posted that there in case it can help other users.

Please, create a topic on our main support forums and I’ll be happy to send you a ready to use plugin you’ll just need to install.

Regards.