| Server IP : 104.21.21.239 / Your IP : 216.73.216.201 Web Server : Apache/2.4.68 (Amazon Linux) OpenSSL/3.5.5 System : Linux ip-172-31-69-123.ec2.internal 6.1.176-223.369.amzn2023.x86_64 #1 SMP PREEMPT_DYNAMIC Fri Jul 24 13:34:27 UTC 2026 x86_64 User : ec2-user ( 1000) PHP Version : 8.4.23 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : ON Directory : /home/home2/cgny/public_html/newadmin/ckfinder34/samples/ |
Upload File : |
<!DOCTYPE html>
<!--
Copyright (c) 2007-2016, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://cksource.com/ckfinder/license
-->
<html>
<head>
<meta charset="utf-8">
<title>CKFinder 3 Samples</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--[if lt IE 9]>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
<link href="css/sample.css" rel="stylesheet">
</head>
<body>
<header class="header-a">
<div class="grid-container">
<h1 class="header-a-logo grid-width-30">
<a href="index.html"><img src="img/logo.png" alt="CKFinder Logo"></a>
</h1>
<nav class="navigation-b grid-width-70">
<ul>
<li><a href="http://docs.cksource.com/ckfinder3/" class="button-a">Documentation</a></li>
</ul>
</nav>
</div>
</header>
<main class="grid-container">
<nav class="tree-a tree-a-layout grid-width-30">
<h1>CKFinder Samples</h1>
<h2>Website Integration</h2>
<ul>
<li><a href="widget.html">Widget</a></li>
<li><a href="popups.html">Popup</a></li>
<li><a href="modals.html">Modal</a></li>
<li><a href="full-page.html">Full Page</a></li>
</ul>
<h2 class="tree-a-no-sub"><a href="ckeditor.html">CKEditor Integration</a></h2>
<h2>Skins</h2>
<ul>
<li><a href="skins-moono.html">Moono</a></li>
<li><a href="skins-jquery-mobile.html">jQuery Mobile</a></li>
</ul>
<h2 class="tree-a-active">User Interface</h2>
<ul>
<li><a href="user-interface-default.html">Default</a></li>
<li><a href="user-interface-compact.html">Compact</a></li>
<li><a href="user-interface-mobile.html">Mobile</a></li>
<li class="tree-a-active"><a href="user-interface-listview.html">List View</a></li>
</ul>
<h2 class="tree-a-no-sub"><a href="localization.html">Localization</a></h2>
<h2>Other</h2>
<ul>
<li><a href="other-read-only.html">Read-only Mode</a></li>
<li><a href="other-custom-configuration.html">Custom Configuration</a></li>
</ul>
<h2 class="tree-a-no-sub"><a href="plugin-examples.html">Plugin Examples</a></h2>
</nav>
<section class="content grid-width-70">
<h1>List View</h1>
<p>By default files are displayed in CKFinder as thumbnails. With list view enabled all files will be displayed as a list, one bellow the other. No image previews are available in this mode.</p>
<p>The list view can be enabled regardless of the selected user interface (Default/Compact/Mobile).</p>
<pre class="prettyprint"><code>CKFinder.widget( 'ckfinder-widget', {
defaultViewType: 'list',
width: '100%',
height: 700
} );</code></pre>
<div id="ckfinder-widget"></div>
</section>
</main>
<footer class="footer-a grid-container">
<div class="grid-container">
<p class="grid-width-100">
CKFinder 3 for PHP – <a href="http://cksource.com/ckfinder">http://cksource.com/ckfinder</a>
</p>
<p class="grid-width-100">
Copyright © 2003-2015, <a class="samples" href="http://cksource.com/">CKSource</a> – Frederico
Knabben. <a href="http://cksource.com/ckfinder/license">All rights reserved</a>.
</p>
</div>
</footer>
<nav class="navigation-a">
<div class="grid-container">
<ul class="navigation-a-left grid-width-70">
<li><a href="http://cksource.com/ckfinder">Project Homepage</a></li>
<li class="global-is-mobile-hidden"><a href="https://github.com/ckfinder/ckfinder/issues">I found a bug in CKFinder</a></li>
<li class="global-is-mobile-hidden"><a class="icon-pos-right icon-navigation-a-github" href="https://github.com/ckfinder/ckfinder-docs-samples">Sample Plugins on GitHub</a></li>
</ul>
</div>
</nav>
<script src="js/sf.js"></script>
<script src="js/tree-a.js"></script>
<script src="../ckfinder.js"></script>
<script>
CKFinder.widget( 'ckfinder-widget', {
defaultViewType: 'list',
width: '100%',
height: 700,
// Specifying ID is not needed when setting defaultViewType.
// It is set here just to make sure this CKFinder instance will not share user settings with other instances.
id: 'custom-listview'
} );
</script>
<script src="//cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js" type="text/javascript"></script>
</body>
</html>