
<p>
  Every company need a backend-office system, either SCM, ERP and others. You
  can build everything from scratch or start from something already exist to
  save your time. Here, I tried to provide list of site provide Intranet
  functions will good content.
</p>
<ol>
  <ol>
    <li>
      <a href="http://www.exoplatform.com/" target="_blank"
        >http://www.exoplatform.com</a
      >/(PHP)
    </li>
    <li>
      <a href="http://openatrium.com/#!/" target="_blank"
        >http://openatrium.com/#!/</a
      >(PHP)
    </li>
    <li>
      <a href="https://www.getpantheon.com/" target="_blank"
        >https://www.getpantheon.com/</a
      >(PHP)
    </li>
    <li>
      <a href="http://www.composite.net/" target="_blank"
        >http://www.composite.net/ (ASP.NET Razor, Web Forms, MVC)</a
      >
    </li>
    <li>
      <a href="http://www.acquia.com/Drupal-7" target="_blank"
        >http://www.acquia.com/Drupal-7</a
      >(PHP)
    </li>
    <li>
      <a href="http://www.bettercms.com/" target="_blank"
        >http://www.bettercms.com/ (ASP.Net MVC platform)</a
      >
    </li>
    <li>
      <a href="http://www.kentico.com/" target="_blank"
        >http://www.kentico.com/ (ASP.NET platform)</a
      >
    </li>
    <li>
      <a href="http://www.lemoon.com/" target="_blank"
        >http://www.lemoon.com/ (ASP.NET platform)</a
      >
    </li>
    <li>
      <a href="https://www.mojoportal.com/" target="_blank"
        >https://www.mojoportal.com/ (ASP.NET, featuring Blogs, Forums, Event
        Calendar, Newsletter, Maps, ecommerce and more.)</a
      >
    </li>
    <li>
      <a href="http://monox.mono-software.com" target="_blank"
        >http://monox.mono-software.com/ (CMS and Social Networking Platform for
        ASP.NET)</a
      >
    </li>
    <li>
      h<a href="http://www.orchardproject.net/" target="_blank"
        >ttp://www.orchardproject.net/ (Orchard CMS is a free, open source
        content management system that allows users to rapidly create web sites
        on the Microsoft ASP.NET platform.)</a
      >
    </li>
    <li>
      <a href="http://virtocommerce.com/" target="_blank"
        >http://virtocommerce.com/ (Virto Commerce is based on .NET 4.5 with
        extensive use of MVC, IoC, EF, Azure and many other cutting edge
        technologies.)</a
      >
    </li>
    <li>
      <a
        href="http://office.microsoft.com/en-us/sharepoint/microsoft-sharepoint-online-collaboration-and-management-software-FX103789366.aspx"
        target="_blank"
        >sharepoint online</a
      >(Sharepoint)
    </li>
  </ol>
</ol>
<h2>getpantheon</h2>
<p>
  If you're start building new system, want to flexiable to customize the site
  and possible to use any programming language, I highly recommand&nbsp;<a
    href="https://dashboard.getpantheon.com/"
    target="_blank"
    >getPantheon</a
  >.&nbsp;
</p>
<ul>
  <li>
    Use open source "OpenAtrium", contains basic login, security, role, media
    &amp; content management.
  </li>
  <li>Fee to try it out.</li>
  <li>Contains development, as DEV, Test, Prod Enviroment.&nbsp;</li>
  <li>Deploy code via SFTP or Git</li>
  <li>Able to export Database and Files</li>
  <li>You don't need to hander WebServer.</li>
</ul>
<p>
  If you have money,&nbsp;<a
    href="https://dashboard.getpantheon.com/"
    target="_blank"
    >getPantheon</a
  >&nbsp;could let your start really quick to create a admin. The programming
  language is PHP.
</p>
<p>
  <img
    src="https://res.cloudinary.com/dmwrakaup/image/upload/v1409096749/mudwavz3g1qdmuhq7zkj.png"
    alt=""
    width="317"
    height="274"
  />
</p>
<p>&nbsp;</p>
<p>
  <a href="https://dashboard.getpantheon.com/" target="_blank">getPantheon</a>'s
  DEV, TEST, PROD enviroment.
</p>
<p>
  <img
    src="https://res.cloudinary.com/dmwrakaup/image/upload/v1409270535/esncffv6vvtpqat6mgsz.png"
    alt=""
    width="322"
    height="214"
  />
</p>
<h2>orchardproject</h2>
<p>
  <a
    style="font-family: 'Segoe UI'; font-size: 13px; line-height: 21px"
    href="http://www.orchardproject.net/"
    target="_blank"
    >orchardproject</a
  >&nbsp;is good intranet too, using ASP.NET MVC.&nbsp;
</p>
<p>
  <img
    src="https://res.cloudinary.com/dmwrakaup/image/upload/v1409121479/ainvoqpagqcukngkjmsm.png"
    alt=""
    width="424"
    height="190"
  />
</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>
  There are just so many different of system out there you can use for your
  intranet system. I'm focus of comparing OpenAtrium, Sharepoint and Orchard.
</p>
<div class="table-responsive">
  <table class="table">
    <colgroup>
      <col width="143" />
      <col width="100" />
      <col width="260" />
      <col width="260" />
      <col width="286" />
      <col width="103" />
      <col width="233" />
    </colgroup>
    <tbody>
      <tr style="height: 21px">
        <td
          style="
            padding: 2px 3px;
            font-size: 120%;
            font-weight: bold;
            vertical-align: top;
          "
          data-sheets-value='[null,2,"name"]'
        >
          name
        </td>
        <td
          style="
            padding: 2px 3px;
            font-size: 120%;
            font-weight: bold;
            vertical-align: top;
          "
          data-sheets-value='[null,2,"Language"]'
        >
          Language
        </td>
        <td
          style="
            padding: 2px 3px;
            font-size: 120%;
            font-weight: bold;
            vertical-align: top;
          "
          data-sheets-value='[null,2,"features"]'
        >
          features
        </td>
        <td
          style="
            padding: 2px 3px;
            font-size: 120%;
            font-weight: bold;
            vertical-align: top;
          "
          data-sheets-value='[null,2,"Pros"]'
        >
          Pros
        </td>
        <td
          style="
            padding: 2px 3px;
            font-size: 120%;
            font-weight: bold;
            vertical-align: top;
          "
          data-sheets-value='[null,2,"Cons"]'
        >
          Cons
        </td>
        <td
          style="
            padding: 2px 3px;
            font-size: 120%;
            font-weight: bold;
            vertical-align: top;
          "
          data-sheets-value='[null,2,"Customize"]'
        >
          Customize App
        </td>
        <td
          style="
            padding: 2px 3px;
            font-size: 120%;
            font-weight: bold;
            vertical-align: top;
          "
          data-sheets-value='[null,2,"Price"]'
        >
          Price
        </td>
      </tr>
      <tr style="height: 21px">
        <td
          style="
            padding: 2px 3px;
            vertical-align: top;
            background-color: #d0e0e3;
          "
          data-sheets-value='[null,2,"OpenAtrium"]'
        >
          OpenAtrium
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"PHP"]'
        >
          PHP, Apache
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"Just a source code provide lots modules, content management"]'
        >
          Just a source code provide lots modules, content management
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"After download OpenAtrium the rest of development you doing you self, could be Pros or Cons"]'
        >
          <p>1. Good Looking UI.</p>
          <p>2. Lots of features.</p>
          <p>3. Greate Communite Support</p>
          <p>4. PHP, largest language using at internet</p>
          <p>5. Able to manage the application life cycle.</p>
          <p>6. It's FREE</p>
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"You need to host the site your self, need to learn, PHP, Apache server, "]'
        >
          <p>
            1. Need to setup everything for development. Deploy, Source Control,
            Different enviroment setup
          </p>
          <p>2. Take time to deploy your time and manage the process.</p>
          <p>3. Management File, Database</p>
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"very frexiable"]'
        >
          very frexiable
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"free"]'
        >
          free
        </td>
      </tr>
      <tr style="height: 21px">
        <td
          style="
            padding: 2px 3px;
            vertical-align: top;
            background-color: #d0e0e3;
          "
          data-sheets-value='[null,2,"Pantheon"]'
        >
          Pantheon
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"PHP"]'
        >
          PHP, Apache
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"Provide hosting OpenAtrium up to 3 site for free.\nUse SFTP, git for development and deploy\nInclude provide, DEV, TEST, Production Enviroment"]'
        >
          Provide hosting OpenAtrium up to 3 site for free.<br />Use SFTP, git
          for development and deploy<br />Include provide, DEV, TEST, Production
          Enviroment
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"install and hosting OpenAtrium Online"]'
        >
          <p>1. Everything Above</p>
          <p>2. Deploy your code right now with DEV, TEST.PROD enviroment.</p>
          <p>
            3. Have to pay but everything you need to develop your site is in
            it.
          </p>
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"need to learn PHP"]'
        >
          1. Need to pay
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"very frexiable"]'
        >
          very frexiable
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"need to pay if want to more features"]'
        >
          need to pay if want to more features
        </td>
      </tr>
      <tr style="height: 21px">
        <td
          style="
            padding: 2px 3px;
            vertical-align: top;
            background-color: #d0e0e3;
          "
          data-sheets-value='[null,2,"Sharepoint2013"]'
        >
          Sharepoint2013
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"Microsoft"]'
        >
          Microsoft
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"Social, Content Management, Workflow, sharing, WorkManagement and more"]'
        >
          Social, Content Management, Workflow, sharing, WorkManagement and more
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"customize sharepoint"]'
        >
          <p>1. Able to customize sharepoint</p>
          <p>2. Choose your server</p>
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"need to setup sharepoint server, cost more money"]'
        >
          1. You have to setup server for sharepoint
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"frexiable"]'
        >
          frexiable
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"linsence, could be expensive"]'
        >
          linsence, could be expensive
        </td>
      </tr>
      <tr style="height: 21px">
        <td
          style="
            padding: 2px 3px;
            vertical-align: top;
            background-color: #d0e0e3;
          "
          data-sheets-value='[null,2,"Sharepoint2013Online"]'
        >
          Sharepoint2013Online
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"Microsoft"]'
        >
          Microsoft
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"Social, Content Management, Workflow, sharing, WorkManagement and more"]'
        >
          Social, Content Management, Workflow, sharing, WorkManagement and more
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"min $5 user/month, use sharepoint server online"]'
        >
          min $5 user/month, use sharepoint server online
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"not frexiable to customize"]'
        >
          not frexiable to customize
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"not very frexiable"]'
        >
          not very frexiable
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"min $5/user/month"]'
        >
          min $5/user/month
        </td>
      </tr>
      <tr style="height: 21px">
        <td
          style="
            padding: 2px 3px;
            vertical-align: top;
            background-color: #d0e0e3;
          "
          data-sheets-value='[null,2,"Orchard1.8.0"]'
        >
          Orchard1.8.0
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"ASP.NET MVC"]'
        >
          C#, ASP.NET MVC
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"Content Management"]'
        >
          Content Management
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"similar with OpenAtrium, only thing need to learn is how to use orchard."]'
        >
          similar with OpenAtrium, only thing need to learn is how to use
          orchard.
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"have to host your self"]'
        >
          have to host your self
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"very frexiable"]'
        >
          very frexiable
        </td>
        <td
          style="padding: 2px 3px; vertical-align: top"
          data-sheets-value='[null,2,"free, modules need to buy"]'
        >
          free, modules need to buy
        </td>
      </tr>
    </tbody>
  </table>
</div>
<p>&nbsp;</p>


Every company need a backend-office system, either SCM, ERP and others. You can build everything from scratch or start fromsomething already exist to save your time. Here, I tried to provide list of site provide Intranet functions will good content.

13 Intranet Application for Use By Back-end Office System


<p>&nbsp;</p>
<p>11 tools for responsive UI.</p>
<ol>
  <li>
    <a href="http://www.browserstack.com/responsive" target="_blank"
      >http://www.browserstack.com/responsive</a
    >
    <p>
      Best tool! Lots of variety testing enviroment.Altought have to paid, but
      it's worth.
    </p>
  </li>
  <li>
    <a href="http://www.studiopress.com/responsive/" target="_blank"
      >http://www.studiopress.com/responsive/</a
    >
  </li>
  <li>
    <a href="http://responsivetest.net/" target="_blank"
      >http://responsivetest.net/</a
    >
  </li>
  <li>
    <a
      href="http://responsivedesignchecker.com/getbootstrap.com/"
      target="_blank"
      >http://responsivedesignchecker.com/getbootstrap.com/</a
    >
  </li>
  <li>
    <a href="http://lab.maltewassermann.com/viewport-resizer/" target="_blank"
      >http://lab.maltewassermann.com/viewport-resizer/</a
    >
  </li>
  <li>
    <a href="http://quirktools.com/screenfly/" target="_blank"
      >http://quirktools.com/screenfly/</a
    >
  </li>
  <li>
    <a
      href="http://www.vandelaydesign.com/responsive-web-design-testing/"
      target="_blank"
      >10 Helpful Resources for Testing Responsive Web Design</a
    >
  </li>
  <li>
    <a href="http://responsive.is/" target="_blank">http://responsive.is/</a>
  </li>
  <li>
    <a
      href="https://chrome.google.com/webstore/detail/responsive-web-design-tes/objclahbaimlfnbjdeobicmmlnbhamkg?hl=en"
      target="_blank"
      >Chrome Extension: Responsive Web Design Tester</a
    >
  </li>
  <li>
    <a href="http://www.hongkiat.com/blog/rwd-tools/" target="_blank"
      >50 Useful Responsive Web Design Tools For Designers</a
    >
  </li>
  <li>
    <a
      href="http://bradfrost.github.io/this-is-responsive/resources.html"
      target="_blank"
      >Responsive Resources</a
    >
  </li>
</ol>


This blog, I'm trying to list few UI framework if you choose the

Few Useful Links for Responsive Web UI Frameworks


<h4>Only showing Play Icon for youtube video</h4>
<p>
  If you don't like youtube default setting as, title, youtube mark, just append
  following parameters to your youtube url and your embed youtube will looks
  like following.
</p>
<p><code>?showinfo=0&amp;color=white&amp;autohide=1</code></p>
<pre
  class="language-javascript"
><code>http://www.youtube.com/embed/9tzyJEwO9Os?showinfo=0&amp;color=white&amp;autohide=1
</code></pre>
<p>
  <iframe
    src="http://www.youtube.com/embed/9tzyJEwO9Os?showinfo=0&amp;color=white&amp;autohide=1"
    width="300"
    height="200"
    frameborder="0"
    allowfullscreen=""
  ></iframe>
</p>
<p>if you want to check the rest of the parameters.&nbsp;</p>
<p>
  <a
    href="https://developers.google.com/youtube/player_parameters"
    target="_blank"
    >&nbsp;YouTube Embedded Players and Player Parameters</a
  >
</p>
<p>&nbsp;</p>
<h4>vimeo video</h4>
<p>
  Following is another video site, vimeo's default view. Good thing for vimeo is
  you can easily change the play icon color like following.
</p>
<pre
  class="language-javascript"
><code>&lt;iframe src="http://player.vimeo.com/video/108883478?title=0&amp;byline=0&amp;portrait=0&amp;color=a89767" width="300" height="128" frameborder="0" allowfullscreen=""&gt; </code></pre>
<p>&nbsp;</p>
<p>
  <iframe
    src="http://player.vimeo.com/video/53755097?title=0&amp;byline=0&amp;portrait=0&amp;color=028482"
    width="300"
    height="225"
    frameborder="0"
    allowfullscreen=""
  ></iframe>
</p>
<p>&nbsp;</p>
<h4>Load youtube iFrame from javascript</h4>
<p>
  <small
    >from
    http://stackoverflow.com/questions/18220209/load-youtube-video-listen-to-onplayerstatechange</small
  >
</p>
<pre class="language-javascript">
// Load API asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        height: '220',
        width: '300',
        videoId: '9tzyJEwO9Os',
        playerVars: {'showinfo': 0, 'color': 'white', 'autohide': 1},
        events: {'onStateChange': onPlayerStateChange}
    });
}

function onPlayerStateChange(event) {    
    if(event.data === 0) {          
        hideVideo();
    }
}

$("#link").click(function(){
    $('#player').show(); // show player
    player.playVideo(); // begin playback
});
</pre>


Category Web

13 Intranet Application for Use By Back-end Office System

Few Useful Links About How to Test Responsive UI

Few Useful Links for Responsive Web UI Frameworks

How to Embedded Video on Your Site