「スマホ・パソコン・Web関連」カテゴリーアーカイブ

スマホ・パソコン・Web関連, ソフトウェア

OpenOfficeでPDFファイルを無料で作る、WordやExcelから無料で変換する方法(Office2007など)

コメントする

無料でpdfに変換したい！Microsoft Officeも古いのしかない！

在宅で仕事をしたり、何か書類を作る必要がある時には、Word、Excel、pdfなどは必ず必要になってくる。
あ
でも、やたらと高い Adobe や、Microsoft Office の新しいバージョンを購入するのも嫌！という人は多いだろう。

Office2010 や 2013 などの比較的新しいモデルは、無料で pdf に変換する機能がついている。

でも2007、2003辺りを今でも使ってる人は、そのままではpdfに変換する事はできない。

 
 

Office2007の無料アドインを使える？　2007 Microsoft Office プログラム用 Microsoft PDF/XPS 保存アドイン からのダウンロード

Office2007に無料のアドイン(マイクロソフトが無償提供していた)ものを入れると、pdfで保存できるようになる。

しかし、Office2007は既に2015年をもってサポート対象外となってしまった。

アドインのダウンロードページ（2007 Microsoft Office プログラム用 Microsoft PDF/XPS 保存アドイン）も今ではリンク切れになってしまっている。

addin-2007
この辺のページも既に全て消滅している…

[名前を付けて保存] の [PDF または XPS]
でpdfで保存することはもはやできない。

当時の2007用アドインのインストーラーは、下記から「右クリック→保存」でダウンロードできるが（拡張子の.txtを外して.exeにすること。）

・SaveAsPDF.exe
・SaveAsXPS.exe
・SaveAsPDFandXPS.exe

接続先のマイクロソフトのページが既に消滅してしまっている。

Office2003やOffice2000の人はそもそもアドインがないので、OpenOfficeを使おう

OpenOffice（オープンオフィス）は、マイクロソフト・オフィスと互換性のある無料のオフィスソフト。

Microsoft Word　→　OpenOffice Writer(ライター)
Microsoft Excel → OpenOffice Calc(カルク)
ワードやエクセルに限らず、パワーポイントなども使える。

OpenOffice.org
から無料でダウンロードして、無料でインストール可能。

普通にワードやエクセルで作って保存したファイルを、OpenOficeライターやカルクで開いてから、

OOo-pdf1

「ファイル」→「PDFとしてエクスポート」をクリック。

OOo-pdf2

圧縮率などを選んで（必要なければそのまま）「エクスポート」。

これで無料でpdfに変換する事ができる。

Ajax他, CSS, スマホ・パソコン・Web関連

メニュー画像オンマウスで、2段目が横並びになるメニューの作り方

コメントする

CSS1個とjsファイル2個で作る簡単2段メニュー

 

2段メニューデモページ

 

色々な応用ができるが、今回は、1段目のメニューは画像、1段目にオンマウスで2段目がニョロリと表れて、文字でリンクが入れれるような形。

 
 

必要なもの

まとめてダウンロードしよう → accordionmenu.zip からダウンロード。

中身：

・accordion.css　← 背景色や1段目のメニューの横幅を変える時に編集する
・accordion.js
・jquery.min.js
・index.html ← 必要ソースは後述
・メニュー画像数個

 

上記個別ファイルは、ファイル名を変えて .txt にしているので、こちらから右クリックでダウンロード保存した場合などは、ファイル名や拡張子を .js や .css なども含めて上記の状態に戻すこと。

 
 

HTMLソースコード

 
まずは <head> ….. </head> の間で CSS と js ファイルを読み込む。

<link rel=”stylesheet” type=”text/css” href=”css/accordion.css” /><!– accordionmenu –>
<script type=”text/javascript” src=”js/jquery.min.js” ></script><!– accordionmenu –>
<script type=”text/javascript” src=”js/accordion.js”></script><!– accordionmenu –>

 
 

メニューを作りたい場所で、HTMLソースを書く。
2段メニューの文字やリンク先はここに記述。

メニュー画像の横幅や背景色を変えたい時は、 accordion.css を編集。

<div id=”gnav”>
<ul>
<li><a href=”index.html” class=”n01″><span>ホーム</span></a>
<div class=”gnavList”>
<ul>
<li><a href=”リンク先1.html”>2段メニュー1</a></li>
<li><a href=”リンク先2.html”>2段メニュー2</a></li>
</ul>
</div><!– gnavList –>
</li><!– ホーム –>
～～～～～～
以下同じ形でメニューが続いて
～～～～～～
</ul>
</div><!– gnav end –>

 
 

accordion.js、jquery.min.js、accordion.cssの3つと、メニュー画像、HTMLをサーバーにアップロード

FTPソフトを使って、ホームページ上にアップロードする。

　index.html
　jsフォルダ
　　accordion.js
　　jquery.min.js
　cssフォルダ
　　accordion.css
　imgフォルダ
　　メニュー画像など

パーミッションなどは関係ないので、644などでOK。

 

2段メニューデモページ

 

CSS, Google, スマホ・パソコン・Web関連

Googleマップをレスポンシブサイトに対応させる方法。スマホサイトに埋め込む時など

コメントする

Googleマップをスマホサイトに埋め込むとはみ出す時の対処法

レスポンシブのスマホサイトに Google map を埋め込むと、はみ出してしまう。

これをはみ出さないようにしたい。

gmap-respon

共有から

gmap-respon2

iframeのタグをコピペする。

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d23796.650854092717!2d140.75646100404356!3d41.79423516221846!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x5f9ef46bcb8d5525%3A0xa9e4bd2d96c4d502!2z54m55Yil5Y-y6Leh5LqU56ic6YOt6Leh!5e0!3m2!1sja!2sjp!4v1460702096429" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

 

HTMLをちょこっとだけ改造

<div class="gmap"><iframe...上のコピペソース.../iframe></div>

という感じで、 div でくくってやる。

そして普通にページに貼り付ける。

ちなみに class名の gmap は何でもOK。

 
 

CSSに追記

.gmap {
 position: relative;
 padding-bottom: 56.25%;
 padding-top: 30px;
 height: 0;
 overflow: hidden;
}

.gmap iframe,
.gmap object,
.gmap embed {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

 
 

これだけで、勝手にレスポンシブに対応してくれる。

コピペソースに　

width="600" height="450"

　などの記述があるが、レスポンシブ時にはこれは無視されるのでそのままでOK。