sfAppStore এর মতো ওয়াপকিজ সাইট তৈরি করুন [পার্ট - 2]


sfAppStore সিরিজের দ্বিতীয় পোস্টে আপনাকে স্বাগতম। তো বন্ধুরা আমরা গত পর্বে আমরা sfAppStore এর CSS, মেটা হেডার, হেডার এবং ফুটার নিয়ে আলোচনা করেছি। বন্ধুরা  এই পোস্টে আমরা এই পোস্টে হোমপেজ, সার্চ পেজ, ক্যাটাগরি পেজ এবং ডাউনলোড পেজের ডিজাইন করবো এবং আগামী পোস্টে বাকি সব পেজের ডিজাইন করবো। এই পোস্ট এমনিতেই সেরকম লম্বা হবে না। কেননা আমি অনেক লম্বা প্রসেসে আমার সাইট ডিজাইন করলেও আপনাদের জন্য কোড গুলো ভালোভাবে সাজিয়ে নিয়েছি। তো বন্ধুরা যারা আগের পোস্ট দেখেন নাই তারা নিচের লিঙ্ক থেকে দেখে আসুন এবং যারা দেখেছেন তারা এই পোস্ট কন্টিনিউ করুন।


হোমপেজ

যদিও sfAppStore এ হোম পেজে প্রতিটি ক্যাটাগরির জন্য আলাদা আলাদা সেকশন তৈরি করা আছে। আমি কিন্তু আপনাদের হোমপেজের জন্য প্লেইন লেটেস্ট আপডেট কোড দেবো। কেননা আমি আমার সাইটে এই সেকশন গুলো ম্যানুয়ালি করেছি তাই আমি এই সংক্ষিপ্ত পোস্টের মধ্যে আপনাদের সেটা বোঝাতে পারবো না। তাই প্লেইন লেটেস্ট আপডেট কোড নিয়েই খুশি থাকুন। তো হোমপেজ ডিজাইনের জন্য জাস্ট নিচের কোড টা অথবা এই লিঙ্কের কোড টা কপি করে হোমপেজের Panel>>HTML / Tag Code>>  এ গিয়ে পেস্ট করে দিন। তাহলেই হোমপেজ ডিজাইন হোয়ে যাবে কেননা আমরা গত পোষ্টেই CSS ইনস্টল করেই রেখেছি।

:title:sfAppStore:/title:
<div class="relative">
	<div style="opacity:1;" class="page_title">Download Free Java App Game & eBooks for your Java mobile.</div>
	<img style="opacity:1;" src="http://sfappstore.yn.lt/Images/apps.jpg" width="100%" height="auto" alt="sfAppStore">
</div>
<div class="file">
	<h2>Latest Uploads</h2>
	[fm]d=all,o=u,l=10,s=:to-page:,no=No File||
	<a href="/site-download.html?to-id=%id%&to-name=%name%">
	<table>
		<tbody>
			<tr>
				<td align="left" width="75" height="100">
					<div class="relative">
						<div class="flag">New</div>
						<img src="%urlthumb%" alt="%lname%" width="75" height="100">
					</div>
				</td>
				<td align="left" height="100" width="100%">
					<div class="app_name">
						<b><u>%name%</u></b>
					</div>
					<b>
						Hits: %hits%<br>
						Size: %size%<br>
						<i class="fa fa-clock-o"></i> %time_upl=--% ago
					</b>
				</td>
			</tr>
		</tbody>
	</table>
	</a>
	[/fm]
</div>


সার্চ পেজ

সার্চ পেজ ডিজাইনের জন্য জাস্ট নিচের কোডটি অথবা এই লিঙ্কের কোডটি কপি করে সার্চ পেজের Panel >> HTML / Tag Code>>  এ গিয়ে পেস্ট করে দিন। তাহলেই সার্চ পেজের কাজ শেষ।

:title:Search:/title:
<div class="file">
	<h2>Search Results</h2>
	[fm]d=all,search=:to-search:o=u,l=10,s=:to-page:,no=No File||
	<a href="/site-download.html?to-id=%id%&to-name=%name%">
	<table>
		<tbody>
			<tr>
				<td align="left" width="75" height="100">
					<div class="relative">
						<div class="flag">New</div>
						<img src="%urlthumb%" alt="%lname%" width="75" height="100">
					</div>
				</td>
				<td align="left" height="100" width="100%">
					<div class="app_name">
						<b><u>%name%</u></b>
					</div>
					<b>
						Hits: %hits%<br>
						Size: %size%<br>
						<i class="fa fa-clock-o"></i> %time_upl=--% ago
					</b>
				</td>
			</tr>
		</tbody>
	</table>
	</a>
	[/fm]
</div>
<div class="menu">
	<div class="paging">
	:page:c=[fm]d=:url-1(:to-id:):,l=0,no=0||%count%[/fm],s=:url-3(:to-page:):,l=5,u=/site-search.html?to-id=:url-1(:to-id:):&to-name=:url-2(:to-name:):&to-page=::
		<span>:url-3(:to-page(1):): of %nlast%</span>
		%prev=«% %n% %next=»% 
	:/page:
	</div>
</div>


ক্যাটাগরি পেজ

ক্যাটাগরি পেজ ডিজাইনেও সেরকম কোনো ঝামেলা নাই। জাস্ট ক্যাটাগরি পেজ থেকে Panel>>HTML / Tag Code>>  এ গিয়ে নিচের বা এই লিঙ্কের কোড টা কপি করে পেস্ট করে দিন। তাহলেই ক্যাটাগরি পেজের কাজ শেষ।

:title: :to-name: :/title:
<div class="file">
	<h2>:to-name:</h2>
	[fm]d=:to-id:,o=u,l=10,s=:to-page:,no=No File||
	<a href="/site-download.html?to-id=%id%&to-name=%name%">
	<table>
		<tbody>
			<tr>
				<td align="left" width="75" height="100">
					<div class="relative">
						<div class="flag">New</div>
						<img src="%urlthumb%" alt="%lname%" width="75" height="100">
					</div>
				</td>
				<td align="left" height="100" width="100%">
					<div class="app_name">
						<b><u>%name%</u></b>
					</div>
					<b>
						Hits: %hits%<br>
						Size: %size%<br>
						<i class="fa fa-clock-o"></i> %time_upl=--% ago
					</b>
				</td>
			</tr>
		</tbody>
	</table>
	</a>
	[/fm]
</div>
<div class="menu">
	<div class="paging">
	:page:c=[fm]d=:url-1(:to-id:):,l=0,no=0||%count%[/fm],s=:url-3(:to-page:):,l=5,u=/site-category.html?to-id=:url-1(:to-id:):&to-name=:url-2(:to-name:):&to-page=::
		<span>:url-3(:to-page(1):): of %nlast%</span>
		%prev=«% %n% %next=»% 
	:/page:
	</div>
</div>


ডাউনলোড পেজ

ডাউনলোড পেজ ডিজাইনের জন্যও কোনো লম্বা প্রসেস নেই। আমার সাইটে প্রতিটি সেকশনের জন্য আলাদা আলাদা কোড ব্যবহার করলেও আপনাদের সুবিধার জন্য একটি কোডের মধ্যেই সব সেকশন দিয়ে দিয়েছি। আপনারা চাইলেই কোড থেকে প্রতিটি সেকশন এর কোড আলাদা করে নিতে পারেন। তো জাস্ট নিচ থেকে অথবা এই লিঙ্ক থেকে কোড কপি করে ডাউনলোড পেজের Panel>> HTML / Tag Code>>  এ গিয়ে পেস্ট করে দিন।

:title: download :to-name:
<div id="file"></div>
[fm]d=all,fn=1,to=:url-1(:to-id:):||
<center>
<h2>%name%.%filetype%</h2>
<div class="index_thumb">
	<a href="%urlthumb%">
		<img class="app_thumb" align="center" src="%urlthumb%">
	</a>
</div>
</center>
<h2>App Info:</h2>
	<p class="info_top">App Name: <u>%name%</u></p>
	<p class="info">App ID: <u>%id%</u></p>
	<p class="info">App Type: <u>%filetype%</u></p>
	<p class="info">App Size: <u>%size%</u></p>
	<p class="info">App Category: <u>%folder_name%</u></p>
	<p class="info">Uploader: <u>:profile(%by%)-var(Name):</u></p>
	<p class="info">Downloads: <u>%hits%</u></p>
	<p class="info">Uploaded at: <u>%time_upl%</u></u></p>
	<a class="download" href="%link%"><b>[<img src="https://i.extraimage.info/pix/FWGpL.png" width="20" height="20"/> Download / Save File]</b></a>
[/fm]
<div class="file">
	<h2>Latest Uploads</h2>
	[fm]d=all,o=u,l=10,s=:to-page:,no=No File||
	<a href="/site-download.html?to-id=%id%&to-name=%name%">
	<table>
		<tbody>
			<tr>
				<td align="left" width="75" height="100">
					<div class="relative">
						<div class="flag">New</div>
						<img src="%urlthumb%" alt="%lname%" width="75" height="100">
					</div>
				</td>
				<td align="left" height="100" width="100%">
					<div class="app_name">
						<b><u>%name%</u></b>
					</div>
					<b>
						Hits: %hits%<br>
						Size: %size%<br>
						<i class="fa fa-clock-o"></i> %time_upl=--% ago
					</b>
				</td>
			</tr>
		</tbody>
	</table>
	</a>
	[/fm]
</div>
<div class="file">
	<h2>Most Downloads</h2>
	[fm]d=all,o=tp,fn=1,l=20,no=No File||
	<a style="color:#001a00;" href="/site-download.html?to-id=%id%&to-name=%name%#file">
	<table>
		<tbody>
			<tr>
				<td align="left" width="75" height="100">
					<div class="relative">
						<div class="flag2"><i class="fa fa-star" style="font-size:15px; margin-bottom:0px; color:#ff0;" ></i></div>
						<img src="http://sfappstore.yn.lt/Images/%id%.jpg" alt="%lname%" width="75" height="100">
					</div>
				</td>
				<td align="left" height="100" width="100%">
					<div class="app_name"><b><u>%name%</u></b> </div>
					<b>
					Hits: %hits%<br>
					Size: %size%<br>
					<i class="fa fa-clock-o" style="font-size:15px;margin-bottom:0px;" ></i> %time_upl=--% ago
					</b>
				</td>
			</tr>
		</tbody>
	</table>
	</a>
	[/fm]
</div>


তো বন্ধুরা এই ছিলো আজকের পোষ্ট। সিরিজের আগামী পোস্ট নিয়ে আসছি শীঘ্রই। ততক্ষণ ভালো থাকুন সুস্থ থাকুন এবং আমাদের সাইটের সাথেই থাকুন, ধন্যবাদ

    

Post a Comment

0 Comments