Jump to content
jsantari

ProcessPageEditLink with multiple classes

Recommended Posts

Is it possible in the  ProcessPageEditLink to define multiple classes as a group. I've tried to add more the one class to a line but this breaks things. Only single classes on a line seem to work. Using a css framework like Bootstrap it would be good to be able to create a class check box for example for the combined classes: btn btn-success btn-sm.

Share this post


Link to post
Share on other sites

How is that different from selecting a checkbox, one each for btn, btn-success and btn-sm? Works for me just fine.

<a href="/blog/" class="btn btn-success btn-sm"></a>

Share this post


Link to post
Share on other sites

You and I both know the right BS classes to use, clients don't. Ideally it would be really cool to have it usean alias for a group of classes - ex; 'Green Link' for 'btn btn-success btn-sm'. Sometimes there are BS theme tweaks involved too so again the alias approach would be more user friendly for the less informed.

Share this post


Link to post
Share on other sites

I see what you mean. Meanwhile, maybe there are workarounds to accomplish what you are after. I have nothing concrete atm :).

Share this post


Link to post
Share on other sites

You could write a simple textformatter module to replace instances of "my-simple-class" with "my-long list-of class-names".

Share this post


Link to post
Share on other sites

What about an autoload module that will make the changes on save? This way, it's done once. Or maybe JavaScript to make changes client-side on click' insert-link'? Hmm, maybe not be as elegant though.  Just some rumblings....

Share this post


Link to post
Share on other sites

A textformatter would be the way to go if these button classes are subject to change (and most often they are). So you can easily just update the textformatter and everything will still work even for older texts. It's always good to keep html in the database as generic as possible so it's not going to cause problems if things change on the frontend.

  • Like 2

Share this post


Link to post
Share on other sites
59 minutes ago, LostKobrakai said:

A textformatter would be the way to go if these button classes are subject to change (and most often they are). So you can easily just update the textformatter and everything will still work even for older texts. It's always good to keep html in the database as generic as possible so it's not going to cause problems if things change on the frontend.

Good point.

Share this post


Link to post
Share on other sites
13 hours ago, kongondo said:

What about an autoload module that will make the changes on save? This way, it's done once. Or maybe JavaScript to make changes client-side on click' insert-link'? Hmm, maybe not be as elegant though.  Just some rumblings....

Good thought. Easiest way for now was to just swap out the single class for the multiple classes with jquery on dom loaded. Works fine.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Robin S
      If you've ever needed to insert links to a large number of files within CKEditor you may have found that the standard PW link modal is a somewhat slow way to do it.
      This module provides a quicker way to insert links to files on the page being edited. You can insert a link to an individual file, or insert an unordered list of links to all files on the page with a single click.
      CKEditor Link Files
      Adds a menu to CKEditor to allow the quick insertion of links to files on the page being edited.

      Features
      Hover a menu item to see the "Description" of the corresponding file (if present). Click a menu item to insert a link to the corresponding file at the current cursor position. The filename is used as the link text. If you Alt-click a menu item the file description is used as the link text (with fallback to filename if no description entered). If text is currently selected in the editor then the selected text is used as the link text. Click "* Insert links to all files *" to insert an unordered list of links to all files on the page. Also works with the Alt-click option. Menu is built via AJAX so newly uploaded files are included in the menu without the page needing to be saved. However, descriptions are not available for newly uploaded files until the page is saved. There is an option in the module config to include files from Repeater fields in the edited page. Nested Repeater fields (files inside a Repeater inside another Repeater) are not supported. Installation
      Install the CKEditor Link Files module.
      For any CKEditor field where you want the "Insert link to file" dropdown menu to appear in the CKEditor toolbar, visit the field settings and add "LinkFilesMenu" to the "CKEditor Toolbar" settings field.
       
      http://modules.processwire.com/modules/cke-link-files/
      https://github.com/Toutouwai/CkeLinkFiles
    • By Robin S
      File Info
      A textformatter module for ProcessWire. The module can add information to local Pagefile links in two ways:
      As extra markup before, within or after the link As data attributes on the link (handy if you want to use a Javascript tooltip library, for instance) Screenshots
      Module config

      Example of output

      Installation
      Install the File Info module.
      Add the textformatter to one or more CKEditor fields.
      Configuration
      Add markup action (and general)
      Select "Add markup to links" Select the Pagefile attributes that will be retrieved. The attribute "filesizeStrCustom" is similar to the core "filesizeStr" attribute but allows for setting a custom number of decimal places. If you select the "modified" or "created" attributes then you can define a date format for the value. Enter a class string to add to the links if needed. Define the markup that will be added to the links. Surround Pagefile attribute names in {brackets}. Attributes must be selected in the "Pagefile attributes" section in order to be available in the added markup. If you want include a space character at the start or end of the markup then you'll need >= PW 3.0.128. Select where the markup should be added: prepended or appended within the link, before the link, or after the link. Add data attributes action
      Select "Add data attributes to links" Select the Pagefile attributes that will be retrieved. These attributes will be added to the file links as data attributes. Attributes with camelcase names will be converted to data attribute names that are all lowercase, i.e. filesizeStrCustom becomes data-filesizestrcustom. Hook
      If you want to customise or add to the attributes that are retrieved from the Pagefile you can hook TextformatterFileInfo::getFileAttributes(). For example:
      $wire->addHookAfter('TextformatterFileInfo::getFileAttributes', function(HookEvent $event) { $pagefile = $event->arguments(0); $page = $event->arguments(1); $field = $event->arguments(2); $attributes = $event->return; // Add a new attribute $attributes['sizeNote'] = $pagefile->filesize > 10000000 ? 'This file is pretty big' : 'This file is not so big'; $event->return = $attributes; });  
      https://github.com/Toutouwai/TextformatterFileInfo
      https://modules.processwire.com/modules/textformatter-file-info/
    • By Robin S
      I got tired of having to open the link dialog in CKEditor in order to check where a link is pointing to, so made this simple plugin.
      Link Hover
      A plugin for CKEditor. Shows the href attribute of a link in a tooltip when the link is hovered. This saves you from having to open the link dialog in order to check where a link points to.

      Installation
      This readme assumes installation in ProcessWire CMS.
      The plugin folder must be named "linkhover" – if necessary, rename the folder to remove the "-master" suffix added by GitHub. Copy the "linkhover" folder to /site/modules/InputfieldCKEditor/plugins/
      In the field settings for each CKEditor field that you want to activate the plugin for, check the "linkhover" checkbox at Input > Plugins > Extra Plugins
       
      https://github.com/Toutouwai/linkhover
    • By Violet
      I've set the ProcessPageEditLink module to ensure that external links are nofollow and target is _blank. Below is an image showing those settings. This works PERFECTLY for links that I add in via the editor, but the problem is that when I toggle editor to "source code" and add in links that way, it won't default to making the external links nofollow and target _blank. It only works when I put the link in via the link button in the editor.  
      The reason this is a bit of an issue is that most affiliate links (which is exactly what you would want to apply this to) are usually given by the company as source code, so I am adding them in by toggling editor to "source code". In that situation, I just can't get the links to default to nofollow and target _blank.
      Some solutions I tried:
      I can add in those attributes manually to my source code, which works, but it's frustrating to do it on each and every link that I'm putting in. Another option that seems to work is clicking on the link inside the editor AFTER toggling out of the source code mode window, and opening up the new link in the editor and hitting "submit", which forces the editor to re-edit the link with the attributes added. But likewise, this is rather clunky and time-consuming, plus I have to remember to do it every time. However, being a newbie to ProcessWire maybe I have overlooked something. Have I been doing something wrong, or is there a workaround that someone could suggest? I'm hoping to figure this out early on, since I'll be using affiliate links in my new website. Thanks for any help that anyone can provide. 

    • By csaba
      Hello,
      Pleased to meet you,my name is Csaba and I'm from Hungary.
      I've just installed processwire to more places.
      I created new parent and children pages.
      The children page links are not displayed on the right side of the parent pages.
      The sample About page is ok, Child page example 1 and Child page example 2 links are visible and live.
      But my child pages are not displayed on the parent pages.
      Please help!
       
×
×
  • Create New...