Skip to main content
Chemistry LibreTexts

5.4: Interactive Molecules and Proteins - Direct Embedding

  • Page ID
    158788
  • \( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \) \( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)\(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\) \(\newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\) \( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\) \( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\) \( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\) \( \newcommand{\Span}{\mathrm{span}}\)\(\newcommand{\AA}{\unicode[.8,0]{x212B}}\)

    Our molecule adding video tutorial on YouTube: youtu.be/-Md0Y90LhyY

    An interactive protein/chemical can be embedded into pages via the following steps. A more advanced Molecule Generator is discussed elsewhere.

    Step 1: Identify the page you want to edit

    For example, let’s say we want to edit this page:

    https://bio.libretexts.org/TextMaps/Map%3A_Biochemistry_Free_and_Easy_(Ahern)/03%3A_Structure_and_Function/3.2%3A_Proteins

    and swap out the collagen image for an interactive image

    clipboard_e75951641c7443cc8b0c693d568d56554.png

    Step 2: Identify the desired ID code

    There are several ways, but best to just grab the PDB code. From the PDB, we can see the code we want is 1BKV: https://www.rcsb.org/structure/1bkv

    clipboard_e511bc1f8f2a8e5798cb1da755f1ff80b.png

    Step 3: Edit the page (in edit mode)

    Edit the page using "Edit" on black bar.

    clipboard_e52aa92d94ed354aa8408bcb19e1c8055.png

    Step 4: Press Elements on toolbar

    clipboard_ecd49ffb5e7731b1b141fe36641f79c59.png

    Step 5: Press Templates on toolbar

    clipboard_e581a592a46117a88aa06d2e14a8e7437.png

    Step 6: Press “EmbedGLMol” and when queried press “Insert template”

    clipboard_ef9deba028fc99e9bfc63a2ebc54a5dc9.png

    Step 7: Edit Code

    The above steps insert this red box with code. You can edit the second line (<script type…) accordingly. The simple thing is to change the code “=1a3n” to the PDB code you desire, in this case “=1bkv” and save

    clipboard_ed025cdb497061f16e3633d7488ecf1d7.png

    Step 8: Review

    Review and if cool, we erase the old image (but keep the caption). There are many options to this system and we are still working them out, but you can see them in the Molecular Generator:

    https://chem.libretexts.org/Visualiz...cule_Reference

    clipboard_eaadf084986e874e11e24b2f382c9a39e.png


    5.4: Interactive Molecules and Proteins - Direct Embedding is shared under a CC BY 1.3 license and was authored, remixed, and/or curated by LibreTexts.

    • Was this article helpful?