diff --git a/next.config.js b/next.config.js
index d949632..b00200a 100644
--- a/next.config.js
+++ b/next.config.js
@@ -2,6 +2,7 @@ const withNextra = require('nextra')({
   theme: 'nextra-theme-docs',
   themeConfig: './theme.config.tsx',
   distDir: "out",
+  defaultShowCopyCode: true
 })
 
 module.exports = {
@@ -11,6 +12,4 @@ module.exports = {
   },
   assetPrefix : "/imageswift-docs/",
   basePath: "/imageswift-docs"
-
 };
-
diff --git a/pages/ImageLoading.mdx b/pages/ImageLoading.mdx
deleted file mode 100644
index 178ad66..0000000
--- a/pages/ImageLoading.mdx
+++ /dev/null
@@ -1,30 +0,0 @@
-# Image Loading in ImageSwift
-
-## Overview
-
-In **ImageSwift**, loading images into Unity GameObjects and sprites is a straightforward process. This section provides guidance on using the library to dynamically load and display images within your Unity project.
-
-## Loading Images into GameObjects
-
-### Loading into RawImage
-
-To load an image into a Unity `RawImage` component, use the following code:
-
-```csharp
-ImageSwift.Load("https://example.com/image.jpg").Into(rawImageGameObject);
-```
-
-This loads the image from the specified URL and sets it as the texture for the RawImage component attached to the given GameObject.
-
-Loading into SpriteRenderer
-To load an image into a Unity SpriteRenderer component, you can use the following code:
-```csharp
-ImageSwift.Load("https://example.com/image.jpg").Into(spriteRendererGameObject);
-```
-
-This loads the image from the specified URL and sets it as the sprite for the SpriteRenderer component attached to the given GameObject.
-
-
-
-
-
diff --git a/pages/LoadingImages.mdx b/pages/LoadingImages.mdx
new file mode 100644
index 0000000..4a5f638
--- /dev/null
+++ b/pages/LoadingImages.mdx
@@ -0,0 +1,62 @@
+# Loading images to component using ImageSwift
+
+## Overview
+
+In **ImageSwift**, loading images into Unity GameObjects and sprites is a straightforward process. This section provides guidance on using the library to dynamically load and display images within your Unity project.
+
+```csharp filename="C#"
+ImageSwift.Load(string: url).Into(targetComponent);
+```
+
+Learn more about these functions down.
+
+### `Load()`
+
+The `Load` function is the starting point for fetching an image in ImageSwift. It is a static method that returns an instance of the `ImageSwift` class, allowing you to chain additional methods for customization.
+
+#### Syntax:
+
+```csharp filename="C#"
+ImageSwift.Load(string url);
+```
+
+Parameter
+`url`  (string): The URL of the image to be loaded.
+
+##### Example:
+```csharp filename="C#"
+ImageSwift.Load("https://example.com/image.jpg");
+```
+This initiates the process of loading the image from the specified URL.
+
+### `Into()`
+The Into function is used to specify the target where the loaded image should be applied. It supports various Unity components, allowing you to display images in different contexts.
+
+##### Example:
+```csharp filename="C#"
+ImageSwift Into(GameObject gameObject);
+ImageSwift Into(SpriteRenderer spriteRenderer);
+ImageSwift Into(RawImage rawImage);
+ImageSwift Into(Image uiImage);
+ImageSwift Into(Sprite sprite);
+```
+
+Examples:
+```csharp filename="C#"
+// Loading into a SpriteRenderer
+ImageSwift.Load("https://example.com/image.jpg").Into(spriteRenderer);
+
+// Loading into a RawImage
+ImageSwift.Load("https://example.com/image.jpg").Into(rawImageGameObject);
+
+// Loading into a Unity UI Image
+ImageSwift.Load("https://example.com/image.jpg").Into(uiImage);
+
+// Loading into a sprite
+ImageSwift.Load("https://example.com/image.jpg").Into(sprite);
+
+```
+This determines where the loaded image should be displayed based on the specified target.
+
+ImageSwift provides callbacks for certain events learn about them more [here](/callback). 
+
diff --git a/pages/_meta.json b/pages/_meta.json
index 37d57d0..401772f 100644
--- a/pages/_meta.json
+++ b/pages/_meta.json
@@ -1,7 +1,8 @@
 {
   "index": "Introduction",
-  "ImageLoading": "Image loading using ImageSwift",
-  "advanced": "Advanced (A Folder)",
+  "installation": "Add ImageSwift To Unity",
+  "LoadingImages": "Loading images",
+  "configuration": "Configuration",
   "about": {
     "title": "About",
     "type": "page"
diff --git a/pages/advanced.mdx b/pages/advanced.mdx
deleted file mode 100644
index a1a5148..0000000
--- a/pages/advanced.mdx
+++ /dev/null
@@ -1,3 +0,0 @@
-# Advanced
-
-This is the index page for the Advanced folder!
diff --git a/pages/advanced/satori.mdx b/pages/advanced/satori.mdx
deleted file mode 100644
index 46eb19f..0000000
--- a/pages/advanced/satori.mdx
+++ /dev/null
@@ -1,3 +0,0 @@
-# Satori
-
-Satori (悟り) is a Japanese Buddhist term for awakening, "comprehension; understanding".
diff --git a/pages/another.mdx b/pages/another.mdx
deleted file mode 100644
index 7fb6a02..0000000
--- a/pages/another.mdx
+++ /dev/null
@@ -1,31 +0,0 @@
-# Another Page
-
-```js filename="demo.js" {3} copy
-let a = 1;
-
-console.log(a);
-```
-
-## Component
-
-import { useState } from 'react'
-
-{/* Import CSS modules */}
-import styles from '../components/counters.module.css'
-
-export const Counter = () => {
-  const [count, setCount] = useState(0);
-  return (
-    <div>
-      <button onClick={() => setCount(count + 1)} className={styles.counter}>Clicked {count} times</button>
-    </div>
-  );
-};
-
-<Counter/>
-
-## External Component
-
-import Counters from '../components/counters'
-
-<Counters />
diff --git a/pages/configuration.mdx b/pages/configuration.mdx
new file mode 100644
index 0000000..1bc0376
--- /dev/null
+++ b/pages/configuration.mdx
@@ -0,0 +1,28 @@
+# ImageSwift Configuration
+
+## Overview
+
+**ImageSwift** provides a flexible configuration system that allows users to customize the behavior and settings of the library according to their project requirements. This section covers the configuration options available and how to use them effectively.
+
+## Configuration File
+
+### Creating a Configuration File
+
+To create a configuration file for `ImageSwift`, follow these steps:
+
+1. **Create a ScriptableObject:**
+
+   Create a new C# script that extends `ScriptableObject` to represent the configuration. For example:
+
+   ```csharp
+   using UnityEngine;
+
+   [CreateAssetMenu(fileName = "ImageSwiftConfig", menuName = "ImageSwift/ImageSwiftConfig")]
+   public class ImageSwiftConfig : ScriptableObject
+   {
+       // Configuration options go here
+       public int MaxConcurrentDownloads = 5;
+       public int CompressionQuality = 75;
+       public bool UseCustomHeaders = false;
+       // Add more configuration options as needed
+   }
diff --git a/pages/index.mdx b/pages/index.mdx
index 51d6d53..312c776 100644
--- a/pages/index.mdx
+++ b/pages/index.mdx
@@ -2,7 +2,7 @@
 
 ## Overview
 
-**ImageSwift** is a versatile Unity library that simplifies the process of loading and downloading images in Unity projects. It offers an easy-to-use API for handling image operations, including downloading images from URLs, caching, and applying them to Unity sprites.
+**ImageSwift** is a versatile Unity library that simplifies the process of loading and downloading images in Unity projects. It offers an easy-to-use API for handling image operations, including downloading images from URLs, caching, and applying them to Unity UI components.
 
 ## Getting Started
 
diff --git a/pages/installation.mdx b/pages/installation.mdx
new file mode 100644
index 0000000..f754bf5
--- /dev/null
+++ b/pages/installation.mdx
@@ -0,0 +1 @@
+# Add ImageSwift to your Unity project
\ No newline at end of file