Etendre les fonctionnalités (ajouter les options manquantes) de l’éditeur tinymce sous Prestashop 1.7

Par défaut sur Prestashop 1.7, l’éditeur de texte ne propose que peu d’option. Il manque notamment un menu pour insérer une vidéo, une date, une ancre html, etc.

Prestashop 1.7 tinymce

Voilà l’éditeur complet :

Prestashop 1.7 tinymce extended
Prestashop 1.7 tinymce extended

Voilà le code qui permet de faire apparaitre toutes ces options et ainsi étendre l’éditeur de texte tinymce.

Il faut remplacer le contenu du fichier /js/admin/tinymce.inc.js


/**
 * Change default icons to marerial icons
 */
function changeToMaterial() {
  var materialIconAssoc = {
    'mce-i-code': '<i class="material-icons">code</i>',
    'mce-i-visualblocks': '<i class="material-icons">dashboard</i>',
    'mce-i-charmap': '<i class="material-icons">grade</i>',
    'mce-i-hr': '<i class="material-icons">remove</i>',
    'mce-i-searchreplace': '<i class="material-icons">find_replace</i>',
    'mce-i-none': '<i class="material-icons">format_color_text</i>',
    'mce-i-bold': '<i class="material-icons">format_bold</i>',
    'mce-i-italic': '<i class="material-icons">format_italic</i>',
    'mce-i-underline': '<i class="material-icons">format_underlined</i>',
    'mce-i-strikethrough': '<i class="material-icons">format_strikethrough</i>',
    'mce-i-blockquote': '<i class="material-icons">format_quote</i>',
    'mce-i-link': '<i class="material-icons">link</i>',
    'mce-i-alignleft': '<i class="material-icons">format_align_left</i>',
    'mce-i-aligncenter': '<i class="material-icons">format_align_center</i>',
    'mce-i-alignright': '<i class="material-icons">format_align_right</i>',
    'mce-i-alignjustify': '<i class="material-icons">format_align_justify</i>',
    'mce-i-bullist': '<i class="material-icons">format_list_bulleted</i>',
    'mce-i-numlist': '<i class="material-icons">format_list_numbered</i>',
    'mce-i-image': '<i class="material-icons">image</i>',
    'mce-i-table': '<i class="material-icons">grid_on</i>',
    'mce-i-media': '<i class="material-icons">video_library</i>',
    'mce-i-browse': '<i class="material-icons">attachment</i>',
    'mce-i-checkbox': '<i class="mce-ico mce-i-checkbox"></i>',
  };
 
  $.each(materialIconAssoc, function (index, value) {
    $('.' + index).replaceWith(value);
  });
}
 
function tinySetup(config) {
 
  if (typeof tinyMCE === 'undefined') {
    setTimeout(function () {
      tinySetup(config);
    }, 100);
    return;
  }  
  if (!config) {
    config = {};
  }
 
  if (typeof config.editor_selector != 'undefined') {
    config.selector = '.' + config.editor_selector;
  }
 
  var default_config = {
    selector: ".rte",
    browser_spellcheck: true,
    plugins : "visualblocks, preview searchreplace print insertdatetime, hr charmap colorpicker anchor code link image paste pagebreak table contextmenu filemanager table code media autoresize textcolor emoticons",
    toolbar2 : "newdocument,print,|,bold,italic,underline,|,strikethrough,superscript,subscript,|,forecolor,colorpicker,backcolor,|,bullist,numlist,outdent,indent",
    toolbar1 : "styleselect,|,formatselect,|,fontselect,|,fontsizeselect,", 
    toolbar3 : "code,|,table,|,cut,copy,paste,searchreplace,|,blockquote,|,undo,redo,|,link,unlink,anchor,|,image,emoticons,media,|,inserttime,|,preview ",
    toolbar4 : "visualblocks,|,charmap,|,hr,",
    external_filemanager_path: baseAdminDir + "filemanager/",
    filemanager_title: "File manager",
    external_plugins: {"filemanager": baseAdminDir + "filemanager/plugin.min.js"},
    language: iso_user,
    skin: "prestashop",
    menubar: false,
    statusbar: false,
    relative_urls: false,
    convert_urls: false,
    entity_encoding: "raw",
    valid_children: "+body[style|script|iframe|section],pre[iframe|section|script|div|p|br|span|img|style|h1|h2|h3|h4|h5],*[*]",
    valid_elements : '*[*]', 
    force_p_newlines : false, 
    cleanup: false,
    forced_root_block : false, 
    force_br_newlines : true,  
    convert_urls:true,
    relative_urls:false,
    remove_script_host:false,
    init_instance_callback: "changeToMaterial"
  };
 
  $.each(default_config, function (index, el) {
    if (config[index] === undefined)
      config[index] = el;
  });
 
  // Change icons in popups
  $('body').on('click', '.mce-btn, .mce-open, .mce-menu-item', function () {
    changeToMaterial();
  });
 
  tinyMCE.init(config);
}


Compter le nombre de groupes associés à un membre

BuddyPress
function count_groups_a_user_is_member($type, $user_id) {
    
    $count = 0;
    
    $group_ids = groups_get_user_groups(bp_displayed_user_id($user_id));
    
    foreach ($group_ids["groups"] as $group_id) {
        
        // Afficher des infos
        //$group_info = (groups_get_group(array('group_id' => $group_id))->name . (end($group_ids["groups"]) == $group_id ? '' : ', ' ) );

        $group_type = bp_groups_get_group_type($group_id);
        //echo $group_type;
        if ($group_type === $type) {
            $count++;
        }
    }
    return $count;
}

// usage
echo count_groups_a_user_is_member('film', $user_id_parameter);

Afficher l’avatar d’un utilisateur BuddyPress

BuddyPress

Afficher dans un template l’avatar d’un user (en dehors de la loop BuddyPress) :

 

$avatar = bp_core_fetch_avatar(array('item_id' => $user_id, 'html' => true, 'object' => 'group', 'type' => thumb, 'avatar_dir' => 'group-avatars', 'alt' => $group->name, 'css_id' => $id, 'class' => $class, 'width' => 50, 'height' => 50));

Retourner le nom d’un utilisateur BuddyPress

BuddyPress

Code snippet pour retourner le nom d’un utilisateur (username ) BuddyPress basé sur son ID (user id)

$name = bp_core_get_username($user_id);

Paramètres

$user_id
// ( int ) optional – User ID to check.
$user_nicename
// ( string|bool ) optional – Optional. user_nicename of user being checked.
$user_login
//( string|bool ) optional – Optional. user_login of user being checked.

$name = bp_core_get_username($user_id);

Afficher tous les termes d’une taxonomie sur Drupal 7

Drupal 7

Code snippet pour afficher tous les termes d’une taxonomie dans un fichier de template, comme page.tpl.php  :

 

// On récupère l'id du node
if (arg(0) == 'node' && is_numeric(arg(1))) {
    $nid = arg(1);
}
// on récupère $node
$node = node_load($nid);

// On récupère les taxonomies lié au node
function example_get_terms($node) {
    $terms = array();

    foreach (field_info_instances('node', $node->type) as $fieldname => $info) {
        foreach (field_get_items('node', $node, $fieldname) as $item) {
            if (is_array($item) && !empty($item['tid']) && $term = taxonomy_term_load($item['tid'])) {
                $terms[] = $term->name;
            }
        }
    }
    return $terms;
}

$terms = example_get_terms($node);

Les guidelines JavaScript AirBnb pour coder proprement en JS

Les guidelines (ou Règles de codage en français) sont des conventions et des règles qui couvrent tous les aspects de l’écriture du code :

  • Indentation
  • Le nommage et l’organisation des fichiers
  • Commentaires
  • Déclaration de variables
  • Convention de nommage, pour nommer les variables, les fonctions, les class, etc.
  • Architecture, etc.
  • Usage des parenthèses, etc.

On n’est pas obligé de les suivre mais cela apporte une cohérence et une meilleure lisibilité du code, surtout si l’on travaille à plusieurs sur un projet.

Découvrez les guidelines qui ont été rédigés par Airbnb sur le repo github :

https://github.com/airbnb/javascript#comments