トップページにモーダルウィンドウで個別記事を表示させたい

Modals bootstrap-modal.jsは使ったことがないのでわかりませんが、できると思いますよ。

Modals bootstrap-modal.jsは非表示のソースをモーダルウィンドウで表示しているだけなのか、Ajaxで読み込んでいるのか、どっちなんでしょう？

ちなみに参考サイトは記事の本文を非表示にしているわけではなく、Ajax（というかPjax）で読み込んでいます。

参考サイトの様にしたい場合、まずモーダルウィンドウ機能を使用しないで、普通に個別ページへ遷移するまではできていますか？

であればもうWordPressの問題ではなく、Ajaxの話になってきます。。。

そもそもModals bootstrap-modal.jsがAjaxで読み込めるかどうかがわかりません…

ちなみにFancyBoxというjQueryのプラグインは結構簡単にAjaxを使えます。

こちらのサイトもAjaxです。リンク先を新しいタブかウィンドウで開いてみてください。
記事一覧ページに全文を隠しているわけではなく、それぞれ個別のページが存在していて、一覧ページではAjaxで本文部分を取得してきて、モーダルウィンドウに表示しています。

一覧ページで各記事の本文を隠すだけであれば、ループ内にthe_content()も記述して、それをdivかなんかで囲んでdisplay:none;で非表示し、divにはid=”post-<?php the_ID(); ?>”などのようにそれぞれの記事を識別できるようにして、あとはjsで対応する本文を表示させるように制御すればいいです。ただしあまりおすすめはしません。サイトのメインコンテンツである記事本文をdisplay:none;などで隠すのはSEO上よろしくありませんし、表示されないかもしれないコンテンツでも毎回読み込まれます。