The forum operates in read-only mode. Please head to StackOverflow for support.

Fri, 06/24/2011 - 02:40

Joined: 24/06/2011

Posts: 4

Adding Code to Link

I am looking for a resource that can give me information on how to modify the link when a user adds a link to the page. Also looking for a resource that will allow me to modify the dialog box of the link to add a new textbox under the place where the user can enter information for google analytics that would be written to the a href line.

Sun, 06/26/2011 - 00:22

neo314

Joined: 16/06/2008

Posts: 30

Re: Adding Code to Link

http://nightly.ckeditor.com/7082/_samples/api_dialog.html

Sun, 06/26/2011 - 02:30

gspearson69

Joined: 24/06/2011

Posts: 4

Re: Adding Code to Link

Thanks for the link and allowed me to easily create a new Tab and Field for my link and I have been able to preset the value of this field. I have also moved the _source/plugins/link/dialog/link.js file to my folder on the website so I can continue to make changes in my current situation.

I have called my new tab GoogleAnalaytics and the text field GoogleAnalyticsField. I have added a loop to display all key/value pairs from the data object and do not see this new field within the object. Would I need to create a new function to have this new field and tab id to be apart of the data object inside of ckeditor?

Sun, 06/26/2011 - 02:56

neo314

Joined: 16/06/2008

Posts: 30

Re: Adding Code to Link

Can you post the code. Also, You don't need to change link.js at all to do this. If your tab was added with this method, you just need to add a button on the tab that adds the field to the end of the url on the info tab. At least that is how I would do it. I assume this is an optional field. You could add you text area to the info tab rather than a second tab (that is in the example as well). Then just include a button that "adds Google Analytic Data to URL" and append the value of the url field with the information in the text box.

Repopulating the textbox if the link is edited might be a bit more tricky, but not impossible though probably not necessary.

Tue, 06/28/2011 - 13:54

gspearson69

Joined: 24/06/2011

Posts: 4

Re: Adding Code to Link

http://www.yourcfpro.com:8888/YourPHPPro/index.html

onclick="recordOutboundLink(this, 'Outbound Links', '/outgoing/http___www_example_com');return false;"

Tue, 06/28/2011 - 18:53

neo314

Joined: 16/06/2008

Posts: 30

Re: Adding Code to Link

CKEDITOR.on( 'dialogDefinition', function( ev )
   {
      // Take the dialog name and its definition from the event
      // data.
      var dialogName = ev.data.name;
      var dialogDefinition = ev.data.definition;

      // Check if the definition is from the dialog we're
      // interested on (the "Link" dialog).
      if ( dialogName == 'link' )
      { ... etc.

$().ready(function() {
  $(".googleLink").click(function() {
    recordOutboundLink($(this), 'Outbound Links', '/outgoing/http___www_example_com');
    return false;
  });
});

$().ready(function() {
  $(".googleLink").click(function() {
    recordOutboundLink($(this).attr("href"));
    return false;
  });
});

$().ready(function() {
  $("a").click(function() {
    recordOutboundLink($(this).attr("href"));
    return false;
  });
});

$().ready(function() {
  $("a").each(function() {
      if ($(this).attr("href").indexOf("example.com") != -1) {
        $(this).click(function() {
          recordOutboundLink($(this).attr("href"));
          return false;
        });
      }
  });
});

Wed, 06/29/2011 - 18:46

gspearson69

Joined: 24/06/2011

Posts: 4

Re: Adding Code to Link

In my html page I have

CKEDITOR.on ('dialogDefinition', function(ev) {
                                var dialogName = ev.data.name;
                                var dialogDefinition = ev.data.definition;

                                if (dialogName == 'link') {
                                        var infoTab = dialogDefinition.getContents('info');
                                        var urlField = infoTab.get('url');
                                        urlField['default'] = 'www.example.com';
                                }

                                dialogDefinition.addContents({
                                        id: 'GoogleAnalytics',
                                        label: 'Google Analytics',
                                        elements : [{
                                                id: 'GoogleAnalyticsField',
                                                type: 'text',
                                                label: 'Google Analytics'}]
                                });

                                dialogDefinition.onFocus = function() {
                                        var urlField = this.getContentElement('info', 'url');
                                        urlField.select();
                                };

                        });

I have not looked at other ways to do this. I am taking a page that uses FCKeditor 2.2 and trying to upgrade it to CKEditor. In the FCKEditor origional page that was done in 2007 a person created this method which had some bugs and I am wanting to upgrade it to current technology. Even though a process might be more time consuming and a large learnign curve, I am all about knowledge. I love to take a current project and do the learning on it to fit current situation so that the knowledge can be used into the future.

I'm not sure what your function recordOutboundLink looks like but you probably don't really need anything but the href from the link. Right? That would be $(this).attr("href") inside the click function and you could probably rewrite the function to only need that parameter and do what you want.

In my html page, I do not have a function recordOutboundLink so in the mean time I will research what this is and see how I can use it for my current situation. I will also look at the JQuery part as I have done some stuff with JQuery but not alot.

Wed, 06/29/2011 - 19:50

neo314

Joined: 16/06/2008

Posts: 30

Re: Adding Code to Link

That function is almost certainly an included js file. I really think the jQuery solution is your best route for this though.