'AdHoc download page'에 해당되는 글 1건

  1. 2013.08.15 iPhone스타일? AdHoc 배포용 다운로드 페이지를 만들어보자.


이왕 AdHoc배포를 한다면 아이폰 스타일로 다운로드 페이지를 만들어 보자.



아래는 html소스이다.

HTML은 지식이 없어 여기저기 소스를 갇다붙였더니 지저분하다. 뭐 잘 보이기만 하면 되지머~ 

<!DOCTYPE html>

<html>

<head>

  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 

  <title>Test Applicationダウンロードページ</title>

  <style type="text/css">

    body {

      background: url(bkg.png) repeat #c5ccd4;

      font-family: Helvetica, arial, sans-serif;

    }

    .congrats {

      font-size: 16pt;

      padding: 6px;

      text-align: center;

    }

    .desc {

      font-size: 10pt;

      padding: 6px;

      text-align: left;

    }

    .step {

      background: white;

      border: 1px #ccc solid;

      border-radius: 14px;

      padding: 4px 10px;

      margin: 10px 0;

    }

    .instructions {

      font-size: 12pt;

    }

    .arrow {

      font-size: 15pt;

    }

    .icon_image {

      border: 1px #ccc solid;

      border-radius: 10px;

    }

    table {

      width: 100%;

    }

  </style>

</head>

<body>


<div class="congrats">Test Application</div>

<div class="step">

  <table><tr>

    <td class="instructions"><b>Test Application<b><br /><font size="2px" color="#ccc">ver.0.9.0<br />2013/08/15</font></td>

    <td width="24" class="arrow">&rarr;</td>

    <td width="57" class="imagelink">

      <a href="itms-services://?action=download-manifest&url=http://devkjcode.com/app/TestApplication.plist">

        <img class="icon_image" src="testApplication-icon.png" height="57" width="57" />

      </a>

    </td>

  </tr></table>

</div>

<div class="desc"> 

<p>初めての方は下記のリンクをタップしてProvisioningをダウンロードしてください。<br />

<a href="http://devkjcode.com/app/TestApplication.provisioning">Provisioningをダウンロード</a></p>

</div>

</body>

</html>


배경용 이미지는 아래 이미지를 사용하면 된다.





Posted by 악당잰 트랙백 0 : 댓글 0

댓글을 달아 주세요