JS Animated. 如何使用图库页面

我们很高兴为您提供有用的指南 在JS动画模板中使用画廊页面 演示了如何编辑文本、图像和更改页面 layout.

为了工作与画廊页面，你应该去 FTP or File Manager at Hosting CPanel 并编辑用于图库页面的文件. 在我们的示例中，它将是index-2.html file. 它也可以下载到您的计算机上，用任何代码编辑 editor 比如notepad++， Dreamweaver等. 并在保存更改后上传回服务器:

1. Page structure:

   该页包含的代码为 rows that usually include 12 grid columns each. 用于页面内容(如图像和文本)的代码由这些选择器用 grid_X (or spanX) 类，其中X定义用于页面上内容列的网格列数. 对于3列网格，使用这种代码结构:

   			
   
   				
    1 column content here 
   				
    2 column content here 
   				
    3 column content here 
   			
   		

   

   如果您需要更改页面上的列数，您应该复制 whole 为网格部分编写代码，并将其插入到“row”元素中. 例如，让我们增加菜单页面上的列数. 更改spanX或grid_X元素中的X号，并确保每行保持12个网格列. 代码应具有以下结构:

   			
   
   				
    1 column content here 
   				
    2 column content here 
   				
    3 column content here 
   				
    4 column content here 
   			
   		

2. Within the grid_X (or spanX) 元素，你可能会发现每个内容部分的代码-通常是图像和文本标题. 以下是两张图片的代码结构，并附有相应的说明:

   			
   
   				
   
   					
    1 image code here 
   					
   1 image caption code here
   				
   
   				
   
   					
   2 image code here
   					
    2 image caption code here 
   				
   			
   		

   

   如果需要向列中添加图像, 只需复制一个带有标题的图像的代码，并将其添加到最后一个图像的代码的右下方(以便在底部插入新图像).

3. Image 代码结构如下所示:

   

   如果你需要禁用 lightbox on the page, 您只需将大图像版本的路径替换为您需要的图像链接 redirect 到点击并删除 part. 以替换图像，即用于 lightbox or thumbnail 本身，将src= " "参数值更改为 img 直线直接粘贴路径到您的新图像那里.

4. Text part 大致如下所示:

   			
   
   				
   Title goes here
   				
   Some caption may be inserted here.
   				
   Some additional text.
   			
   		

   

   这里可以更改图片标题，替换 # in href=”#” with link 在标题上，更改一般的标题文本，如果需要，添加新的或完全删除它.

请随时查看下面的详细视频教程: