Providing branding and receiver X1

11:31 AM
Providing branding and receiver X1 -

This is my second blog post in the Tech Preview of Receiver X1 related series. In my first unless I background and explains the reasons for X1

This post is practical -. to help a step-by-step guide to implement X1. I'll also show you how to make some simple but powerful adjustments brand X1 your company colors.

The Tech Preview download is Storefront 2.7. This is an iteration on 2.6. While there are features that are X1, I will only focus on X1. For the Tech Preview, there is no upgrade support. So, please start with a clean machine or uninstall storefront. (The GA release is support upgrade from earlier versions, but not from the Tech Preview itself).

As a demonstration,
I go on a virtual machine to install and use storefront.

I 2012 R2 (see the release documentation on the download page for a complete list of supported platforms) am using Windows. The machine should connected domain, but there are no other conditions.

Step-By-Step Guide

First load and run the installer. You must be an administrator to perform the steps to compete I demonstrate.

Handle no UAC prompts. (Yes, I know it says "Citrix Delivery Services 'not' Citrix Storefront Know that we currently address these obvious errors

until you by all.. go the obvious steps get to this point.

Once "Finish", the Admin console will be opened. (you can open this again by 'storefront' from the Launcher runs)

. Note: Pin taskbar

The storefront UI should here Previous storefront administrators be no major changes familiar .:

[1945021[

Click the "Create new device" and enter the base URL for your server. use a qualified DNS name, if that's what you're elsewhere use location. storefront can be picky when the name you entered does not match a user which, and while that is not a problem for Web clients, best to get in the habit now. I would suggest even during the tech preview of HTTP for easy stick (of course I would, that HTTPS is advised better for production)

Because I am my test of the uRL http://x1blog-sf.example.net

with

the name comes after the base URL for the primary storage. StoreFront can support many "shops", but most people use only one, and select the rather obvious name 'Store'. Feel free to go with the flow or be as inventive as you like. I'll 'Purple' just so clear what part of the store name (Purple) rather a fixed term in the user. This will result in a number of services (for use of native clients) under / Citrix / purple and a Web Site /Citrix/PurpleWeb.

Next, you need the details of the backend XenApp or XenDesktop services enter intend to use the applications to actually provide. It really helps if you already have a farm. Pretty much everyone will do. (It is possible, a dummy address here and then falsified the applications enter later - I'll come back to that in a later blog). When you put in a dummy server here the system work - but you will not apps

(recovery generally HTTP / Port 80 is only good for a Tech Preview.. you can change the settings of any existing Web interface or storefront providing copy have)

Finally, we want to talk to remote access. For simplicity, I'm picking intentionally "No". If you are using NetScaler Gateway and only care about web access (this is what this Tech Preview concentrated) Select "Enter No VPN tunnel and gateway data. You can always come back and do this later

Once storefront has finished churning, the following is created .:

  • an authentication service
  • A memory pointed to the XenApp / XenDesktop service indicated.
  • website, the points in the store. This is again where X1 lives.

Let us, before we make a brief overview of the web interface adaptation.

If you open the Web site the new login page set. login of the domain trust any access your storefront in is

[haslogged

Once the user, in the it, something like this is available on a page.

If you want to take a look at an 'almost' live site, I have set a canned version here:

http://samples.citrixcloud.net/x1/1-VanillaSite/receiver.html?-db

The sample site uses dummy applications and has some limitations - mainly no login "Start" will not work and subscriptions will not forget - but it is a quick way to take a tour, and later in this series, I'll show you how to use it to speed up your own development.

This user interface displays three tabs in. "Favorites", "Desktop" and "Apps". The first tab shows applications that must highlight the use of, or had urged. This will be the default tab, once the user has some applications in itself. (They note that if you disable subscription in showcase, this tab will be hidden). The second tab "desktops" is displayed if (and only if) the user has some desktops. Again, you can disable it if you do not want it. The last "Apps" tab contains all the applications the user publishes, regardless of whether they have subscribed. Some people call this a "Store '.

(as Brit, the fact that" favorites "is the" wrong "spelled way a little not rust. It is, of course, customizable, and we'll see at changing strings or adding new locations in a later blog)

corresponds For users of the previous iterations of the receiver, the "favorites" tab on the main receiver UI, is the desktop tab equivalent to "desktops" in Web- receiver, and the "Apps" tab corresponds to the plus sign on the left side of the interface in previous recipients.

styling

First, know that some changes have been completed in the Admin console We will include the following:.

1) Create some functional groups of applications

2) Change the Logo of the receiver to a company logo

3) changing the color scheme to match the company logo

Special app groups

is arbitrary collection of applications that you want to highlight to the user. Examples could for top-level categories be - "Sales", "Marketing", etc. Or new applications or new initiative to "Mobile Workspace" .. If you have no need for this feature, you do not create groups. The user interface is adapted to fit.

Each featured app group next

  • has a name, which may include basic formatting (eg old)
  • A description of
  • A number of applications by name, keyword or category selected.
  • A tile background. We ship 9 different tiles. You can add your own course.
  • an overlay image. This is just about adaptation, but allows you to add some polish.

Note that App-groups may be established within storefront, rather than on the back-end XenApp / XenDesktop farms. The advantage of this is that it allows an administrator responsible for end-user access, without the need to promote / highlight applications to make changes to the back-end infrastructure.

Let's add a simple group. You must get to know at least one app in your area name.

a feature app Group

  1. Select add your Receiver for Web sites,
    Note that, although this is X1, it is still a beneficiary for the site is compatible with all existing functions. This site will be used in future to provide the user interface to domestic customers - even though the tech preview on the web is limited
  2. Select 'Manage Popular App groups
  3. [
  4. Share a feature-app group. We use select filter apps by, as this is the name of the simplest approach. Any application that has a word matching one of the names you enter will be added to the group. I'll "2013" to choose, all of my Office 2013 applications will match.

Note that users are only applications see published them, and only see groups containing at least one app to publish - so you can create Bundles for specific user groups or applications without people confusing for which they do not apply. Be aware though that the full list of feature groups is sent to each client, so it do not be used for security purposes. A working group app "Apps in connection with the hostile takeover of WWCo" is called, is probably not a good idea ....

Make sure that you 'ok' often enough for the change click actually applied will!

Take a look in a browser

Note we default show the featured group "tile" three symbols. Again, this is adaptable, but we will later save for as it is a bit tricky.

A functional group app looks a bit lonely. I would suggest to create at least three.

Here is a Canned site displayed Offf

http://samples.citrixcloud.net/x1/2-FeaturedApps/receiver.html?-db

Let us continue a company logo and color scheme to add. Again, you can do this from the admin interface. Select a suitable image in advance. Keep the image small, and ideally on a transparent background. You can also buy a double size Logo License with all the high-dpi screens are (especially mobile).

They also help in preparing to find out what color your business favors. You can color, do so (I personally prefer Paint.Net as it will give you the result as a friendly CSS hex code)

using the color .:

  1. Open Company site or other appropriate page
  2. hit "print" (PrtScn)
  3. Open Microsoft Paint and "paste"
  4. Use meet the "Eye Dropper" tool, reading order (in this case, blue header)
  5. Open "edit colors" the color, the color as RGB values ​​

now armed to pick with the logo image and color, go back to showcase, and click 'Customize site'.

Note that you get a mini-preview of the logo and colors in place. This is just a guide - in practice, the logo will be smaller than in the preview displayed

Refresh to see in a browser your masterpiece.

And again, here is a canned site shows what we just did.

http://samples.citrixcloud.net/x1/3-Branded/receiver.html?-db

This is basically it for this blog post. But I wanted, by terminating a quick overview of what has happened under the covers, and explain how we build this in the next edition.

When we created the adjustment in the Admin Console, we actually caused the creation of a CSS file. CSS (Cascading Style Sheets) files are part of the Trinity, the HTML5 makes - HTML, JavaScript and CSS. We will use all three as we can deep customization in the. But even simple CSS changes can have a profound effect.

To see what we have done, you will see the following file

http://samples.citrixcloud.net/x1 /3-Branded/custom/style.css

This is where we apply all our stylistic adaptation, and this is where changes to style ~~ POS = TRUNC also (between the MANAGED SECTION show up in the Admin console made markers).

  / * the following section of the file is reserved for the use of storefront. * /   / * CITRIX DISCLAIMER: START managed SECTION. Edit NO ART IN THIS SECTION * /  
  .theme header bgcolor {background-color: # 32A9C3; }  
  .Logo container {background-image: url ( 'WWCO_logo_white.png'); Background-size: 29px 112px; }  
  / * CITRIX DISCLAIMER: END OF MANAGED SECTION. * / * Add   / custom styles below this line. * /  

CSS is a powerful and potentially complex animal, but the basics are simple. This file says:

"Collect any portion of the page marked with Class subject-header-bgcolor and change its background color to the specified value"

"Find a are part of the page marked with class logo-tank and make the label on the URL background image and press the background image of the specified size "

to be classes only comments in the side, and we have provided many parts for our own purposes with notes and also to enable the adjustment. Here are some key ones:

  .Logo container  
  .theme header bgcolor  
  , Topic-header-color  
  .theme highlight color  
  .dialog key  
  .dialog-button.default  

One last thing before I close. , CSS classes can be nested, and we use that the "fashion" that part of the user interface to display, are in For example, if I want to change the header color on desktops, but not mobile phones, I could use:

 .Large .theme header bgcolor {background-color: # 32A9C3; } 

Much more in the next blog.


blogs in this series

  • Welcome to the Receiver X1
  • providing and branding receiver X1
  • X1 adaptation: Want to CSS [deeper
  • Scripting X1
  • receiver X1 APIs
  • X1 skin for NetScaler Gateway
  • X1 DIY approvals
  • alto receiver is dead. Long live New receiver.
Previous
Next Post »
0 Komentar