Override standard buttons in salesforce service cloud console - salesforce

Is it possible to override the standard 'Create new ' button and 'detail' link in the list view of service cloud console?
I want to show my custom VF pages on click of these buttons/links.(if yes how?)
In addition, any examples to the service cloud API toolkit would be helpful.
Thanks in advance.

Best would be to create separate set of buttons as it's less redirects...
If you want to really override standard ones I think you'll have to use normal overrides (on all buttons) but with content based on Javascript you'd be deciding what should happen.
http://www.salesforce.com/us/developer/docs/api_console/index.htm - Console JS API will be handy.
Make a visualforce page that uses standardController="Your_Object__c". In the content include a reference to the Console API and code similar to this example of isInConsole():
<apex:includeScript value="/support/console/27.0/integration.js"/>
<script type="text/javascript">
function testIsInConsole() {
if (sforce.console.isInConsole()) {
alert("in console");
} else {
alert("not in console");
}
}
</script>
Except you'll be redirecting either to your special pages or to standard "new" and "edit". To force going to original edit mode you can add nooverride=1 parameter in the URL (which is also mentioned in the documentation of URLFOR function).
Normal "new Account" (results in override if specified): /001/e
Force go to your page: /apex/NewAccount
Force go to standard page: /001/e?nooverride=1
So now you have an idea how to detect whether you're in console or not and where to go. Only remaining question is "which window should redirect". Because Console is built on frames you might get different results on using javascript window, location, parent etc. objects. That's a general knowledge how to work with frames in JS so I'm not going to write that up. But I'll include a link to srcUp() function provided by salesforce that you might want to reuse.
I think it's defined only in Console context to be honest so maybe you could ditch the whole isInConsole in favor of typeof srcUp != 'undefined'?
Good luck :)

Related

Adding Segment telemtry to React component that is only one DOM node

I'm looking to add segment analytics to my JupyterLab extension. No worries if you've never heard of a JupyterLab extension - the best way to think about it: I get control over a single node in the DOM where I can place some HTML, so I'm doing the following:
function Welcome(props) {return <h1>Hello</h1>;}
ReactDOM.render(<Welcome/>, dom_element_i_control)
This all works fine - I'm now looking to add some analytics code to this. For example, I'd like to be able to:
See when my code is rendered
See when someone interacts with my rendered element (e.g. if there was a button in the Welcome function, when the user clicked on it).
However, segment is a JS library that is delivered as a script that you load into a webpage at the top in a string tag like:
<script>
!function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&...}}();
</script>
Where would I even put this code? I don't have control over the larger page + HTML, so I'm not sure where I can slap this so I can start using analytics.
Thanks for any information!
My workaround:
Instead of using the above linked segment script, I used the analytics-node package from segment.
I create an Analytics object right before ReactDOM.render - and then can use it wherever I want :)
Note that this will not work for anyone who uses an add blocker, obviously!

Exclude Page from being tracked in Omniture

Is there a way to remove single page from being tracked in Omniture(Site Catalyst). I want to track all pages instead of only one page. I don't want to send request to Omniture if that page has been hit.
Is there a way to update script for that?
Thanks
Yes, there is a way. If you click the cog next to the Adobe Analytics Tool on the Overview page in DTM you'll be taken to a settings page. The tab on the bottom titled Customize Page Code, this will run before your adobe beacon would normally be sent. Simply put your logic to select the correct page and then return false and your tracking beacon wont fire.
if (location.pathname =='whatever') {
return false;
}
**If you don't have any idea what you're doing codewise, be careful. There is a lot of breakage and data loss that can occur if users put bad code here.
If you're unfamiliar with javascript, I would suggest seeking out a little help. If you want to give it a shot but you're unsure of your code, I would suggest navigating to the page that you want to remove, opening the console (F12), and typing location.pathname. This will give you the exact string to test again so your code should be:
if (location.pathname == 'whatever/string/the/location/pathname/gave/you') {
return false;
}
Make sure you don't forget the quotes. Good luck!

How to customize auth0 Lock login UI?

I am trying to customize my login screen in auth0 lock, to change logo, i placed below code. and its working fine.
theme: {
logo: 'https://example.com/logo58px.png'
},
languageDictionary: { title: 'Custom title here' }
its not working,
But I wanted to change text auth0 to my app name, How can I change that?
There's no real easy way to go about this. All of the settings for Auth0 Lock are available to you though. In lock.js you'll find all available settings you need.
For example, if you want to change the title, open lock.js in your favorite text editor and CTRL+F for "Auth0" (include the quotes") and you'll find what it is you need.
In my version of lock it's in an object that looks like this:
exports.default = {
...
title: "Auth0",
...
}
If you're looking to change the UI as in CSS-rules, simply inspect the Auth0 Lock in the browser, look for a specific class on the object you'd like to change and set your own rules to it.
It's not that much of a hassle in terms of "reverse engineering" (Loosely using that term here) but you can virtually change anything you want about the Auth0 Lock.
Just don't forget to include it in your repo.
While #Tom Nijs's answer does fix your problem, it is not good practise to change the source code of the library that you are using. An example where you could lose your modified code is when you update the Auth0 Lock library. Keeping track of all these pieces of modified code between different versions of libraries is a real hassle.
Instead, I would suggest to do the following:
The Auth0 Lock exposes the languageDictionary property in the settings property.
So to continue with your provided code snippet, you could do this in the lock's settings:
`theme: {
logo: 'https://example.com/logo58px.png'
},
languageDictionary: {
title: 'Custom title here',
forgotPasswordAction: 'Custom lost password phrase here'
}`
If you are looking to customise more properties/text, you can just add them to the languageDictionary object, all the possible properties can be found here => https://github.com/auth0/lock/blob/master/src/i18n/en.js
The property names depend on the Auth0 Lock version, above configuration is for Auth0 Lock 10.0.0+
Property names of earlier lock versions are also still available in Auth0's documentation.
Another option would be to use Auth0's new universal login and customize it.
I've created a full tutorial for this

Create Landing Page in Drupal 7

In Drupal one can basically style the elements, like the search box, or the basic page etc. and then put some content in the site and the resulting page will be generated. But what if you want one specific site (e.g. the index page) to be different? E.g. have a image as a background, a different navigation styling etc.
What's the best paractice way of doing this?
Best practice is to have a different theme which you can switch to by using hook_custom_theme() where you check the current path. Also make sure that your theme to switch to is enabled:
/**
* Implements hook_custom_theme().
*/
function YOUR_MODULE_custom_theme() {
# check path with arg(0)
# return theme name to switch to
return 'different_theme_machine_name';
}
Alternatively you can also try ThemeKey doing this out of the box with an interface & allowing you the specify rules.
If you need to change only the content(body) section of your page, use Disply Suite. You can create unique look and feel layouts for your body section of each page.
If you trying to change the complete layout of one page (eg: Services), Create new Content Type 'Services'. Then create a template file for this content type, You must name this template call page--services.tpl.php. And also you can overwrite the index page layout by creating page--front.tpl.php template. Done!
What you are saying you want to change is all styling. And you know you can do a page to look drastically different with CSS... and you can do it that way depending on your chosen Drupal theme.
Now, with the Chrome Inspector (or FF inspector) look at the body tag, it probably has many classes which indicates in what page you are, what type of node (if it's a node) or if it's an admin section, or an anonymous user.
Using those specific classes you can style a frontpage, or a view, or a node, or anything, without installing more modules... with some limitations because you can't change rendered HTML this way.
Finally, don't get scared by using modules in Drupal, it's how Drupal works and it works pretty well. The thing is to install the best tools to increase your productivity, and Drupal have excellent options to change your theming and content like Display Suite (like #BaikHo suggested).
Hope that helps.
PD: Using the less module and with custom your theme you can have LESS css which is considerably faster than using only CSS, and because it's integrated with Drupal you can theme make everything even faster. Give it a try.

adding controller later

I'm trying to create an NG app where parts can be enabled/disabled dynamically. The idea is to have an "admin" page, where parts of the app can be enabled or disabled, and then see new functionality appear, in the form of an adjusted menu at the top of the page, and matching routes, controllers, etc loaded into the app (I'm using SocketStream w/ NG).
The first step was to add / remove routes dynamically, for which I found a solution at https://stackoverflow.com/a/13173667 - working well, as far as I can tell.
Next, adding items to the menu bar - easy with ng-repeat on ul/li items.
So the app adjusts its menu and recognizes the corresponding route. So far so good.
The problem comes with registering a controller. I'm calling myApp.controller('SandboxCtrl',[...]) with proper args (same as what worked when initialising statically on startup), but the controller does not appear to get loaded or inited properly. Navigating to the newly added route generates errors such as:
Error: Argument 'SandboxCtrl' is not a function, got undefined
assertArg#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:973
assertArgFn#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:984
#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:4638
update#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:14007
$broadcast#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:8098
#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:7258
wrappedCallback#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:6658
wrappedCallback#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:6658
#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:6695
$eval#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:7848
$digest#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:7713
$apply#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:7934
#http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.1/angular.js:5433
I'm currently at a loss on how to proceed. I've not been able to find a solution on the web. The app is too large to put in a jsFiddle, but I can commit the last changes on GitHub if needed.
Questions: is this feasible? what can I do to debug this? any examples I could look at?
EDIT: The code is now at https://github.com/jcw/housemon (needs node/npm/redis). It's easy to reproduce the problem: launch with "npm start", browse to localhost:3333, go to admin tab, click on "jcw-sandbox" and then "Install". Top menu will update with new a "Sandbox" entry. Clicking on that entry generates the error shown above.
Oh, almost forgot: relevant code is in client/code/app/main.coffee and client/code/modules/routes.coffee ...
The answer turns out to be two-fold:
the NG calls were made from SocketStream RPC callbacks, and had to be wrapped in $scope.$apply calls - my bad, didn't know about this SS/NG interaction
the rest of the solution was outlined by #matys84pl - pick up $controllerProvider (and $filterProvider) early on, so they can be called at a later time instead of the normal "app.controller" and "app.filter" members, which don't seem to work anymore later on
Example code in GitHub, I'll link to a specific commit so this answer stays valid:
https://github.com/jcw/housemon/commit/f199ff70e3000dbf57836f0cbcbb3306c31279de

Resources