2012年02月17日 web関連

さきほど、Gumroadにユーザー登録してみました。
どうやって活用していくか全然考えてないのですが、どんな感じなのか知りたかったので、登録&販売商品を登録してみました。

ユーザー登録から販売までが数クリックで完了するので、実に簡単でした(・∀・)
WEBの知識が無い方でも簡単にネット上でダウンロード販売出来る感じです。

ユーザー登録

メールアドレス、パスワードを入力し、登録をするだけです。登録後に完了メールが届きますので、承認する必要があるようです。承認前でもログイン、販売商品の登録などは、普通にできました。

販売商品の登録

販売するものの名前、ファイルのアップロード(もしくは公開中のURLの設定)、価格を設定すれば、販売リンクの登録が完了します。
あとは、商品リンクを宣伝するだけって感じでした。価格のデフォルトは「$2」に設定されていました。

gumroadの登録〜販売の手順&管理画面の説明

テスト販売として、「gumroadの登録〜販売の手順&管理画面の説明」をスクリーンショットと説明付きでまとめてみました。

管理画面

管理画面内は、販売商品情報の編集、アカウント設定(通貨、Paypalなどの設定)、カスタムCSSを使ってプロフィールページのデザインカスタマイズなどのメニューがありました。

カスタムCSSを使って、自分の名前の横にFacebookのアイコンを設置してみました。

カスタムCSSに設置したコード

#seller_under_quote strong {
background-image: url(http://my_icon_image_url.jpg);
background-repeat:no-repeat;
padding-left:30px;
}

カスタムCSSのコードは、販売ページ内のBODY内にCSSが以下のような感じで追加されるようです。

<body id="link">

  <div id="modal-container">
    <div class="modal-container-background"></div>    
  </div>

<div class="top-bar"></div>

<div class="flash-message"></div>

<div id="wrapper">

 <style type="text/css">
  #seller_under_quote strong {
background-image: url(http://my_icon_image_url.jpg);
background-repeat:no-repeat;
padding-left:30px;
}
  </style>

...以下省略

今回カスタムCSSを適用して、テスト販売してみたページ

カスタムCSS適用後の販売ページ

Gumroadを初めて使ってみた感想は、非常に簡単で、すぐに販売が出来ました。今後、活用していけたらいいなぁと思いました(・∀・)

近々、購入の流れをまとめてみよーかなと思います。

この投稿へのコメント

コメントはまだありません。

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます。
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CAPTCHA


ピックアップ記事

twitter API からプロフィール画像を取得・表示

2011年07月28日 web関連twitter API
twitter API からプロフィール画像を取得・表示する方法です。 リクエストURL [php]http://api.twitter.com/1/users/profile_image?screen_name=apr_20&size=bigger[/php] 画像として表示 [php]<img src="http://api.twitter.com/1/users/…
「twitter API からプロフィール画像を取得・表示」をはてなブックマークに追加

レスポンシブ対応 画像メニューをブラウザ幅に合わせて縮小表示

2014年11月15日 web関連HTML5・CSS3
レスポンシブ対応 画像メニューをブラウザ幅に合わせて縮小表示
レスポンシブ対応のサイトを作るときに画像メニューを設置して、ブラウザが縮小されても画像が改行されることなく、1列で固定で、画像の比率を保ったまま縮小表示させる方法です。 cssのdisplay:table-cellで解決 html [php]<ul id="nav"> <li><a href="#"><…
「レスポンシブ対応 画像メニューをブラウザ幅に合わせて縮小表示」をはてなブックマークに追加

twitter公式ウィジェットの背景色をクリアにする

2011年05月26日 web関連
ブログやサイトなんかにtwitterウィジェットを使う事が多くなりましたが、ウィジェットの背景を透明にしないとサイトにマッチしないなぁという場合もあるかと思いますので、その方法を書いておきます。簡単ですが。。。(笑) theme: {    shell: {      background: 'none',  …
「twitter公式ウィジェットの背景色をクリアにする」をはてなブックマークに追加

Twitter API を使わずにプロフィール画像を取得する

2011年07月29日 web関連twitter API
Twitter APIを使っていると、プロフィール画像の取得だけで、さくさく利用限度が減って行きます。 公式のAPIを使わず、もっと簡単に画像を取得出来る方法があるようなので、ご紹介。 …
「Twitter API を使わずにプロフィール画像を取得する」をはてなブックマークに追加

DREAMWEAVER CS6でSCSSを使うための準備

2015年03月03日 web関連
dreamweaver CS6では、scss,sassなどが使えません。使えないというか、コードヒントやコードカラーリングが適用されず、テキスト扱いと同様になってしまいます。 検索すれば、多くのサイトで説明されていますが、以下の作業をすればコードヒントが使えるようになります。 scssを追加する手順 1.DWの環境設定>ファイルタイプ/エディター内の「コードビューで開く」の箇所に「.scss」を追加します。(sassも使いたい場合は.sassも追加) 2. アプリケーション ▸ Adobe Dreamweaver CS6 ▸ Configuration 内の「Extensions.txt」とアプリケーション ▸ Adobe Dreamweaver CS6 ▸ Configuration ▸ DocumentTypes内の「MMDocumentTypes.xml」を編集 …
「DREAMWEAVER CS6でSCSSを使うための準備」をはてなブックマークに追加
© graffiti on the web . All rights reserved. WordPress Theme by comfy